css text-decoration上划线下划线

时间:2016-07-05
在CSS中,使用text-decoration属性来定义段落文本的下划线、删除线和顶划线。本文章向大家介绍css text-decoration属性的使用方法和实例,需要的朋友可以参考一下。

text-decoration 属性规定添加到文本的修饰。

 

text-decoration介绍

在CSS中,使用text-decoration属性来定义段落文本的下划线、删除线和顶划线。

语法:

text-decoration:属性值;

text-decoration属性取值如下表:

描述
none 默认。定义标准的文本。
underline 定义文本下的一条线。
overline 定义文本上的一条线。
line-through 定义穿过文本下的一条线。
blink 定义闪烁的文本。
inherit 规定应该从父元素继承 text-decoration 属性的值。

 

text-decoration实例

设置h1,h2,h3和h4元素文本装饰:

<!DOCTYPE html>
<html>
<head>
<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>

在线运行

 

我们在HTML教程中学习了删除线用<s>标签下划线用<u>标签,现在我们学习了text-decoration属性之后,这些效果都应该用CSS控制。

记住,前端开发中,对于样式一般用CSS来控制,不建议使用标签来控制。也就是说,我们应该摒弃纯样式标签,如<s>、<u>等。

上一页 下一页

原文地址:http://www.manongjc.com/article/1139.html