样式之文字下划线

  • 第一 text-decoration: underline;

    • 缺点是不好修改颜色 不要修改下划线的位置，优点就是一行代码解决
    • 可以使用line-height: 20px; 也能调整位置;
  • 第二种更全面 使用span标签而且不会变形 border-bottom: 2px solid #409eff; padding-bottom: 5px;
  • 第三种可以使用box-shadow模拟
    • box-shadow: h-shadow(必需 水平阴影位置,可负值) v-shadow(必需 水平阴影位置,可负值) blur(可选 模糊距离) spread(可选 阴影大小) color(可选 阴影颜色) inset(可选 从外层的阴影（开始时）改变阴影内侧阴影)
    • box-shadow: 0 -1px #409eff inset;

  • 第四种可以用标签的形式 使用u标签如： 下划线

CSS样式下划线的更多相关文章

  1. outline轮廓线在不同CSS样式下的表现

    outline轮廓线在不同CSS样式下的表现 CSS 去除浏览器默认 轮廓外框 在默认情况下,点击 a 标签,input,或者添加click事件的时候,浏览器留下一个轮廓外框(chrome之下为蓝色) ...

  2. 纯css导航下划线跟随效果【转载】

    css: ul { display: flex; position: absolute; width: 800px; top: 50%; left: 50%; transform: translate ...

  3. android:为TextView加入样式——下划线，颜色，设置链接样式及前背景色

    实现下划线及颜色设置: public class AtActivity extends Activity { LinearLayout ll;     /** Called when the acti ...

  4. CSS 文本下划线 text-decoration

      定义和用法 text-decoration 属性规定添加到文本的修饰. 可能的值 值 描述 none 默认.定义标准的文本. underline 定义文本下的一条线. overline 定义文本上 ...

  5. CSS样式下border的几种线型

    在用border的时候经常会忘记它有多少种线型以及各种线型的写法:每次都得从头开始,或是用到Google.百度之类的,有空整理了一下 (1)none (没有边框,无论边框宽度设为多大) (2)dott ...

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

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

  7. 纯css实现Magicline Navigation(下划线动画导航菜单)

    看别人网站的时候,看到一种导航菜单的动画,觉得很有意思,就仔细研究起来. 目前见过的动画有三种:水平下划线动画导航.水平背景动画导航.垂直动画导航,他们实现思路都是一样的,都是依赖 css3的同级通用 ...

  8. 不可思议的纯CSS导航栏下划线跟随效果

    先上张图,如何使用纯 CSS 制作如下效果? 在继续阅读下文之前,你可以先缓一缓.尝试思考一下上面的效果或者动手尝试一下,不借助 JS ,能否巧妙的实现上述效果. OK,继续.这个效果是我在业务开发的 ...

  9. tab 切换下划线跟随实现

    HTML 结构如下: <ul> <li class="active">不可思议的CSS</li> <li>导航栏</li> ...

随机推荐

  1. ubuntu php连接oracle数据库

    转载请注明来源:https://www.cnblogs.com/hookjc/ 需要将数据库从mysql迁移到oracle.下了个oracle xe在ubuntu下折腾了好久,都只能启动1521的侦听 ...

  2. js表达式和语句

    表达式 一个表达式可以产生一个值,有可能是运算.函数调用.有可能是字面量.表达式可以放在任何需要值的地方. 语句 语句可以理解为一个行为,循环语句和判断语句就是典型的语句.一个程序有很多个语句组成,一 ...

  3. oracle修改密码、添加用户及授权

    解锁某个用户 sqlplus/as sysdba; alter user scott account unlock; 忘记密码处理 登录:sqlplus/as sysdba;修改:alter user ...

  4. 动画推荐-By胡罗

    常用16种视图切换动画 系统自带的动画,结构清晰,代码简单 带弹性动画的分享菜单-https://github.com/KittenYang/KYShareMenu 第一眼以为用的是Pop动画,看了下 ...

  5. RHCSA阶段笔记

    命令终端字段含义介绍 [root@localhost ~]# 解释: root:当前登录系统用户名(root超级管理员) localhost :当前主机名 :当前用户所在目录( 为家目录) ,root ...

  6. ESXI系统从0搭建流程

    ESXI系统从0搭建流程 简单介绍 简单介绍:项目中使用到了这个系统,我自己不会搭建,但是请教别人之后自己成功搭建出来了此系统.所以在此记录一下搭建流程,希望能够帮助"零"小白. ...

  7. 内省机制（操作javaBean的信息）

    内省机制(操作javaBean的信息) ----是不是联想到了反射机制了哈,这两者有什么区别呢? 1.内省机制和反射机制的联系 ■ 其实内省机制也是通过反射来实现的,而反射是对一切类都适合去动态获取类 ...

  8. Ubuntu20.04 Focal Cloudimage扩容以及KVM安装的问题记录

    运行Ubuntu20.04的KVM虚机遇到一些问题, 单独总结一下 镜像扩容 不能用virt-resize --expand /dev/sda1 old.qcow2 new.qcow2这样的命令, 这 ...

  9. angular访问后台服务及监控会话超时的封装实现

    以前一直没有想过写一些东西来把项目中用到的知识点及技术实现做一个归纳整理并分享出来.现在打算逐渐的把项目中的一些东西整理并分享出来,与大家共勉! angular本身自带访问组件http和httpcli ...

  10. 渗透测试工具篇之目录扫描工具dirmap

    (一)dirmap介绍 一个高级web目录扫描工具,功能将会强于DirBuster.Dirsearch.cansina.御剑 (二)dirmap安装 打开浏览器输入https://github.com ...