小码哥的IT人生

CSS :first-line 选择器 详解

css3基础 2023-07-22 16:40:57小码哥的IT人生shichen

CSS :first-line 选择器

实例

选择每个 <p> 元素的首行,并为其设置样式:

p:first-line { background-color:yellow; }

完整实例:

<!DOCTYPE html>
<html>
<head>
<style>
p:first-line
{
background-color:yellow;
}
</style>
</head>
<body>
<h1>WWF's Mission Statement</h1>
<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>

可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html

浏览器支持

表格中的数字注明了完全支持该属性的首个浏览器版本。

选择器 Chrome IE Firefox Safari Opera
:first-line 1.0 9.0 1.0 1.0 7.0

定义和用法

:first-line 选择器用于选取指定选择器的首行。

注释:以下属性可与 :first-line 使用:

  1. 字体属性
  2. 颜色属性
  3. 背景属性
  4. word-spacing
  5. letter-spacing
  6. text-decoration
  7. vertical-align
  8. text-transform
  9. line-height
  10. clear

相关页面

CSS 教程:CSS 伪元素

版权所有 © 小码哥的IT人生
Copyright © phpcodeweb All Rights Reserved
ICP备案号:苏ICP备17019232号-2  

苏公网安备 32030202000762号

© 2021-2024