CSS样式

//不只是a标签,其他有下划线的字体也可以

a:hover{

 color: #ff3100; //这里的颜色是指字体颜色不是波浪下划线效果的svg图颜色
    text-decoration: none;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 4'%3E%3Cpath fill='none' stroke='%23ff3300' d='M0 3.5c5 0 5-3 10-3s5 3 10 3 5-3 10-3 5 3 10 3'/%3E%3C/svg%3E") repeat-x 0 100%
    background-size: 20px auto;
    animation: waveMove 1s infinite linear;
}
 
 
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 4'%3E%3Cpath fill='none' stroke='%23ff3300' d='M0 3.5c5 0 5-3 10-3s5 3 10 3 5-3 10-3 5 3 10 3'/%3E%3C/svg%3E") repeat-x 0 100%

下划线文字,鼠标hover小样式的更多相关文章

  1. 解决文字和text-decoration:underline下划线重叠问题

    一.text-decoration:underline下划线的问题 CSS text-decoration:underline可以给内联文本增加下划线,但是,如果对细节要求较高,就会发现,下划线经常会 ...

  2. 5-去掉a标签下划线,禁止a标签的跳转

    1.去下划线: 写样式,a{text-decoration:none; 或在a标签内联里面写style="text-decoration:none;": 2.禁用a标签跳转: a标 ...

  3. 超链接标签a样式生效,取消下划线,文字垂直(上下)居中

    直接设置超链接标签a的属性时并不会生效, 需要将display属性改为inline-block, 即style="display:inline-block" 添加标签a时,默认是有 ...

  4. 利用伪元素和css3实现鼠标移入下划线向两边展开效果

    一.思路: 将伪元素:before和:after定位到元素底部中间,设置宽度从0变成100%达到目的. 二.实现: 1.首先定义一个块状元素(行内元素没有宽高)并修改样式为一个背景色为浅灰色的矩形,设 ...

  5. 转帖 利用伪元素和css3实现鼠标移入下划线向两边展开效果

    原帖地址   https://www.cnblogs.com/yangjunfei/p/6739683.html 感谢分享 一.思路: 将伪元素:before和:after定位到元素底部中间,设置宽度 ...

  6. CSS超链接样式,去除下划线等

    控制超链接样式 链接的四种状态: a:link - 普通的.未被访问的链接 a:visited - 用户已访问的链接 a:hover - 鼠标指针位于链接的上方 a:active - 链接被点击的时刻 ...

  7. iOS - UIButton设置文字标题下划线以及下划线颜色

    创建button设置可以折行显示 - (void)viewDidLoad { [super viewDidLoad]; UIButton * button = [[UIButton alloc] in ...

  8. php 把驼峰样式的字符串转换成下划线样式的字符串

    1.如何在php中把驼峰样式的字符串转换成下划线样式的字符串.例:输入是FooBar的话,输出则是foo_bar 以下是用正则的方式去完成,既然用到正则,方法肯定就不只一种,我们看下下面的方式 ech ...

  9. 利用css实现鼠标经过元素,下划线由中间向两边展开

    代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

随机推荐

  1. Jpeglib读取jpg文件

    整理自: http://hi.baidu.com/lewutian/item/e8eed42664ee61122a0f1c89 http://blog.csdn.net/mcgrady_tracy/a ...

  2. VS.左侧_蓝黄绿_竖线

    1.vs2013中,写代码中,旁边会出现蓝色或者黄色的线,请问是什么意思?求大神告知_百度知道.html(https://zhidao.baidu.com/question/1862841692529 ...

  3. CentOS 7系统KVM虚拟机安装过程详解

    什么是 KVM ? KVM 在标准的 Linux 内核中增加了虚拟技术,从而我们可以通过优化的内核来使用虚拟技术.在 KVM 模型中,每一个虚拟机都是一个由 Linux 调度程序管理的标准进程,你可以 ...

  4. [转帖]关于 /dev/urandom 的流言终结 | Linux 中国

    关于 /dev/urandom 的流言终结 | Linux 中国 2019年05月05日 14:03:52 技术无边 阅读数 202   版权声明:本文为博主原创文章,遵循CC 4.0 by-sa版权 ...

  5. orcale备份语句

    1.创建一个文件夹,比如d盘下创建一个expdp的文件夹 d:\expdp2.使用一个用户,必须具有DBA权限 比如 sqlplus /nolog conn system/password@数据库连接 ...

  6. 设置springmvc全局异常

    设置全局异常,将异常信息指定内容展示给前端页面,保证程序的安全性 @Slf4j@Componentpublic class ExceptionResolver implements HandlerEx ...

  7. Codeforces 718A Efim and Strange Grade 程序分析

    Codeforces 718A Efim and Strange Grade 程序分析 jerry的程序 using namespace std; typedef long long ll; stri ...

  8. npm—入门指导

    npm npm是什么? NPM(node package manager),通常称为node包管理器.顾名思义,它的主要功能就是管理node包,包括:安装.卸载.更新.查看.搜索.发布等. npm的背 ...

  9. Python基础 第三章 使用字符串(1)精简版

    所有标准序列操作(索引,切片,乘法,成员资格检查,长度,最小值,最大值)都适于字符串. 但,字符串是不可变得,故所有得元素赋值和切片赋值都是非法的. 1. %s 转换说明符 设置字符串格式 %左边指定 ...

  10. 由[].slice.call()引发的思考

    由[].slice.call()引发的思考   经常看到大家用[].slice.call()或者Array.prototype.slice.call():  我一直是一知半解的,今天算是基本弄清楚了, ...