css :first-line选择器使用详情

时间:2016-08-05
css :first-line选择器用于选取块元素的第一行并为其设置css样式,例如p:first-line表示选取每个段落的第一行,本文章向大家介绍css :first-line选择器的使用方法和实例,需要的朋友可以参考一下。

css :first-line选择器介绍

css :first-line选择器用于选取块元素的第一行并为其设置css样式。

css :first-line仅作用于块元素。内联元素要使用该选择器,必须先设定heightwidth属性,或者设定position属性为absolute,或者设定display属性为block。

如果未强制指定元素的width属性, 首行的内容长度可能不是固定的。

语法:

:first-line { 
   style properties 
}

如:

p:first-line {font-weight: bold;}/*设置每个段落的第一行文字为加粗*/

 

css :first-line实例

设置每个段落元素的第一行的样式:

<!DOCTYPE html>
<html>
<head>
<style>
p:first-line{
    background-color:yellow;
}
</style>
</head>
<body>
<h1>WWF's Mission Statement</h1>
/* http://www.manongjc.com/article/1314.html */
<p>To stop the degradation of the planet's natural environment and to build a future in which humans live in harmony with nature, by; conserving the world's biological diversity, ensuring that the use of renewable natural resources is sustainable, and promoting the reduction of pollution and wasteful consumption.</p>
</body>
</html>

在线运行

上一页 下一页

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