DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> WEB前端代碼 >> CSS :first-line 偽元素
CSS :first-line 偽元素
編輯:WEB前端代碼     
定義和用法
: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:///a/bjac/5603ifb6.htm
<br />這是第3行</p>
</body>
</html>

效果:

這是第一行
http:///a/bjac/5603ifb6.htm
這是第3行

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved