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. CORS扫描工具

    参数链接: https://github.com/chenjj/CORScanner 未发现Cors风险 已发现Cors风险 py2遇到的坑: 提示https ssl告警 /usr/local/lib ...

  2. 【DSP开发】德州仪器达芬奇五年之路七宗罪，嵌入式处理器架构之争决战2012

    芯片是产业链上游重要的一个环节,一颗小小的芯片具有极高的技术含量和价值,半导体行业每年都会有一个各大厂商营业额的排名,除去2009年,常年盘踞在前三名位置的分别是英特尔,三星半导体和德州仪器,英特尔凭 ...

  3. 使用js加载器动态加载外部js、css文件

    let MiniSite = new Object(); /** * 判断浏览器 */ MiniSite.Browser = { ie: /msie/.test(window.navigator.us ...

  4. 前端ajax中运用post请求和get请求之于session验证

    首先我们来看下ajax两种请求的区别: Ajax中POST和GET的区别Get和Post都是向服务器发送的一种请求,只是发送机制不同. 1. GET请求会将参数跟在URL后进行传递,而POST请求则是 ...

  5. centos7 64位如何配置网络

    在虚拟机的操作的时候,修改  ifcfg-eno16777736 可能没有权限 su - //进入root用户状态chmod a+w  ifcfg-eno16777736//把该文件修改为可写状态 我 ...

  6. Design Excel Sum Formula

    Your task is to design the basic function of Excel and implement the function of sum formula. Specif ...

  7. oracle - for in loop 循环更新

    用法:目的更新B表的数据 查询出A表的字段,命名为表1.然后更新B表 BEGIN FOR 表1 IN ( SELECT [匹配字段],[更新字段] FROM A表 ) loop UPDATE B表 S ...

  8. Scala当中什么是Transformation和 Action，以及它们俩的区别是什么？

    [学习笔记] 一个完整的RDD任务由两部分组成:Transformation和 Action.Transformation用于对RDD的创建,还可以把老的RDD通过Transformation来生成新 ...

  9. Java学习路径

    -------第一部分:基础语法-------- 1.输出语句 1.1 hello world 1.2 拼接输出.换行和不换行输出 1.3 拼接变量输出 2.输入语句: 2.1 定义变量,赋值(整数. ...

  10. Ural 1248 Sequence Sum 题解

    目录 Ural 1248 Sequence Sum 题解 题意 题解 程序 Ural 1248 Sequence Sum 题解 题意 给定\(n\)个用科学计数法表示的实数\((10^{-100}\s ...