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. OpenCV 例程

    采集图片显示视频: #include <iostream> #include <opencv2/opencv.hpp> using namespace std; using n ...

  2. windows下使用命令行编译、链接C++源文件

    目录 1.流程 2.操作 1.流程 .cpp-->.o-->.exe 分别为 源文件-->中间目标文件-->可执行文件 两个-->的过程分别为编译.链接 p.s.多个 . ...

  3. Gradle DSL Walle渠道包后安装启动APP

    DSL(Domain-Specific Language) Gradle 是一个编译打包工具,但实际上它也是一个编程框架. Task 是 Gradle 中的一种数据类型,它代表了一些要执行或者要干的工 ...

  4. JavaWeb开发常用的前端控件

    罗列的下述控件大多依赖jquery插件,故可提前导入jquery插件以免出错 Validform 提供对表单的验证.提交等功能,具体可查阅其官方文档>>>Validform 示例如下 ...

  5. window 杀固定端口的进程

    window 杀固定端口的进程   一. 查看所有进程占用的端口   在开始-运行-cmd,输入:netstat –ano可以查看所有进程       二.查看占用指定端口的程序   当你在用tomc ...

  6. python 基础（十五）--time和datatime模块

    time模块 time.time():返回当前时间,时间戳 time.clock():返回cpu时间(?),当有time.sleep()时,time.clock()不计时 time.localtime ...

  7. python — 生成器、推导式、递归

    目录 1 生成器(函数的变异) 2 推导式 3 递归 1 生成器(函数的变异) 判断一个函数是否是生成器函数:只需看函数内部是否有yield # 生成器函数(内部是否包含yield) def func ...

  8. S02_CH13_ AXI_PWM 实验

    S02_CH13_ AXI_PWM 实验 当学习了上一章的协议介绍内容后,开发基于这些协议的方案已经不是什么难事了,关键的一点就是从零到有的突破了.本章就以AXI-Lite总线实现8路LED自定义IP ...

  9. 【AC自动机】Censoring

    [题目链接] https://loj.ac/problem/10059 [题意] 有一个长度不超过  1e5 的字符串 .Farmer John 希望在 T 中删掉 n 个屏蔽词(一个屏蔽词可能出现多 ...

  10. 怎样快捷获取网页的window对象

    使用document.defaultView; document.defaultView === window 注意: 1. 如果当前文档不属于window对象, 则返回null; 2. docume ...