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. Fabric docker-compose volumes配置解析

    chaincode: container_name: chaincode image: hyperledger/fabric-ccenv tty: true environment: - GOPATH ...

  2. vue知识点积累

    vue中 列表组件写key,起作用是什么? <ul> <li v-for="item in items" :key="item.id"> ...

  3. c++学习笔记_5

    前言:本笔记所对应的课程为中国大学mooc中北京大学的程序设计与算法(三)C++面向对象程序设计,主要供自己复习使用,且本笔记建立在会使用c和java的基础上,只针对与c和java的不同来写 继承 继 ...

  4. poj1947（树上分组背包）

    题目链接:https://vjudge.net/problem/POJ-1947 题意:给定一棵树,求得到一个结点数为p最少删多少条边. 思路: 明显的树形dp,分组背包.用dp[u][j]表示在结点 ...

  5. linux 系统自签免费ssl证书和nginx配置

    首先执行如下命令生成一个key openssl genrsa -des3 -out ssl.key 1024 然后他会要求你输入这个key文件的密码.不推荐输入.因为以后要给nginx使用.每次rel ...

  6. [百度贴吧]飞腾1500a .VS. 龙芯3a3000： 同频实用性能对比

    贴吧关于 龙芯与飞腾的简单对比. https://tieba.baidu.com/p/5682824804?red_tag=0221728732 龙芯3a3000实用性能 ,还不如4年前发布的FT15 ...

  7. uniapp如何使用阿里iconfont

    1.将iconfont中需要的图标,添加到购物车,然后添加到自己的项目.生成在线代码. 2.点击下载至本地.然后解压后复制 iconfont.css 文件到你的项目. 3.复制第一步生成的代码,替换i ...

  8. Meta Post

    $\require{color} \require{enclose}$ 写博客的一些技巧和工具. To use the following three macros it is necessary t ...

  9. 串的模式匹配，KMP算法

    串的模式匹配 现考虑一个常用操作,在字符串s(我们称为主串)中的第pos开始处往后查找,看在主串s中有没有和子串p相匹配的的,如果有,则返回字串p第一次出现的位置. 暴力求解 int Index(ch ...

  10. window下 php7+apache2搭建

    一.下载php7和apache2.4 首先下载php7的windows压缩包,到这里下载http://windows.php.net/download/ Php7  VC14 x86 Thread S ...