• 技术文章 >web前端 >css教程

    css如何取消链接下划线

    王林王林2021-05-19 14:28:55原创6274

    css取消链接下划线的方法是,给链接文本添加text-decoration属性,并且设置属性值为none就可以了,例如【h3 {text-decoration:none;}】。

    本文操作环境:windows10系统、css 3、thinkpad t480电脑。

    css中提供了一个专门用来设置文本修饰的属性text-decoration,利用该属性我们可以自定义添加到文本的修饰,下划线、上划线、删除线等。

    一些常用属性值:

    举个例子:

    比如我们要设置h1,h2,h3和h4元素文本装饰

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8"> 
    <title></title> 
    <style>
    h1 {text-decoration:overline;}
    h2 {text-decoration:line-through;}
    h3 {text-decoration:underline;}
    </style>
    </head>
    
    <body>
    <h1>This is heading 1</h1>
    <h2>This is heading 2</h2>
    <h3>This is heading 3</h3>
    </body>
    
    </html>

    看下运行效果:

    762a96f56f522554deb17c8aca19893.png

    相关视频分享:css视频教程

    以上就是css如何取消链接下划线的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css 链接 下划线
    上一篇:css如何关闭浮动 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • html怎么去掉超链接的下划线• 如何使用css去掉a标签的下划线?(代码详解)• css怎么设置下划线• css超链接如何去掉下划线
    1/1

    PHP中文网