您的位置:首页 - web前端
CSS :first-line 伪元素
定义和用法
:first-line 伪元素向文本的首行添加特殊样式。

这个伪元素用于设置元素中的第一行文本的样式,而不论该行出现多少单词。
:first-line 只能与块级元素关联。可以应用到首字母的属性是有限的。


注释:下列属性应用于 :first-line 伪元素:
font 属性
color 属性
background 属性
word-spacing
letter-spacing
text-decoration
vertical-align
text-transform
line-height
clear


伪元素可与 CSS 类结合:
p.article:first-line {color: #FF0000}

<p class="article">A paragraph in an article</p>
本例将把所有 class="article" 的段落的第一行字符设置为红色。


实例
向段落的第一个字符添加特殊样式(让第一行颜色变红):
<html>
<head>
<style type="text/css">
p.keleyi:first-line
{
color:#ff0000;
font-variant:small-caps;
}
</style>
</head>
<body>
<p class="keleyi">这是第一行<br />http://keleyi.com/a/bjac/5603ifb6.htm
<br />这是第3行</p>
</body>
</html>

效果:

这是第一行
http://keleyi.com/a/bjac/5603ifb6.htm
这是第3行

本站导航
相关文章
柯乐义 Copyright© keleyi.com