CSS偽元素first-line的使用方法

2024-07-11 07:46:11

字體：大中小

來源：轉載

供稿：網友

CSS偽元素是CSS選擇符的一部分，由于其不是CSS真正的元素，就稱之為偽元素。在特殊情況下，可以實現不錯的效果。

first-line偽元素，用于匹配一個段落的第一行的樣式可以應用在first-line中的屬性包括：font，color，background，word-spacing，letter-spacing，text-decoration，vertical-align，text-transform，line-height。

first-line偽元素只可以和塊類元素（div、p）連用

first-line這個偽元素可以支持IE6,IE7,IE8,IE9,FF,CH,OP,SA瀏覽器。

下面是一個例子：

p:first-line { background:#CCC; color:#333; }

這個偽元素設置段落的第一行背景色為#CCC，字體顏色為#333.

下面是一個完整的例子：

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="keywords" content="CSS 偽元素 first-line" /> <meta name="description" content="這里演示了CSS偽元素first-line的使用。" /> <title>CSS偽元素first-line的使用—武林網CUOXIN</title> <style> p:first-line { background:#CCC; color:#333; } </style> </head> <body> <p>武林網CUOXIN（http://m.survivalescaperooms.com/）致力于向各位網友提供最精彩的IT技術文章，網站以“在這里，學會電腦”為建站宗旨，以“學習、共享、愉悅”為基本理念。目前，本網站主要開通4個頻道：IT知識庫、休閑娛樂、問吧和下載中心。希望能以最好的內容以饗大家。</p> </body> </html>