CSS僞類語法

時間 2019-11-08

標籤 css 語法欄目 CSS 简体版

原文原文鏈接

CSS僞類用於向某些選擇器添加特殊的效果，在支持CSS的瀏覽器中，連接的不一樣狀態均可以不一樣的方式顯示，這些狀態包括：活動狀態，已被訪問狀態，未被訪問狀態，和鼠標懸停狀態。css

CSS僞類html

CSS僞類用於向某些選擇器添加特殊的效果。瀏覽器

CSS定位屬性學習

CSS僞類的語法：htm

selector:pseudo-class{property:value;}CSS類也可與僞類搭配使用：seo

selector.class:pseudo-class{property:value;}get

錨僞類it

在支持CSS的瀏覽器中，連接的不一樣狀態均可以不一樣的方式顯示，這些狀態包括：活動狀態，已被訪問狀態，未被訪問狀態，和鼠標懸停狀態。io

a:link{color:#FF0000}/*unvisitedlink*/ class

a:visited{color:#00FF00}/*visitedlink*/

a:hover{color:#FF00FF}/*mouseoverlink*/

a:active{color:#0000FF}/*selectedlink*/

在CSS定義中，a:hover必須被置於a:link和a:visited以後，纔是有效的。

在CSS定義中，a:active必須被置於a:hover以後，纔是有效的。

僞類名稱對大小寫不敏感。

CSS僞類和CSS類

CSS僞類能夠與CSS類配合使用：

a.red:visited{color:#FF0000}

<a class="red" href="css_syntax.html">CSSSyntax</a> 假如上面的例子中的連接被訪問過，那麼它將顯示爲紅色。

CSS2:first-child僞類

CSS僞類中:first-child僞類對另外一個元素的第一個子元素進行匹配。

例子1：

在這個例子中，選擇器對div元素中的第一個子元素爲p的元素進行匹配-對div元素內的第一個段落進行縮進：

div>p:first-child{ text-indent:25px; }

<div>

<p>div中的第一段。這個段落將被縮進。</p>

<p>div中的第二段。這個段落不會被縮進。</p>

</div>

下面的HTML中的段落將不會被匹配：

<div>

<h1>Header</h1>

<p>div中的第一段，但不是div中的第一個子元素。這個段落不會被縮進。</p>

</div>

例子2：

在這個例子中，選擇器將對p元素中的第一個子元素爲em的元素進行匹配-而且將p元素中的第一個em元素設置爲粗體：

p:first-childem{ font-weight:bold; }

例如，下面的HTML中的em是段落的第一個子元素： <p>Iama<em>strong</em>man.</p>

例子3：

在這個例子中，選擇器將對任何元素的第一個子元素爲a的元素進行匹配-將text-decoration屬性設置爲none：

a:first-child{ text-decoration:none; }

例如，下面的HTML中的第一個a元素是段落中的第一個子元素，因此沒有下劃線。

可是第二個a不是段落的第一個子元素，因此有下劃線。

<p>訪問<ahrefahref="http://www.w3school.com.cn">W3School</a>學習CSS！訪問<ahrefahref="http://www.w3school.com.cn">W3School</a>學習HTML！</p>

CSS2:lang僞類

CSS僞類中:lang僞類使你有能力爲不一樣的語言定義特殊的規則。在下面的例子中，:lang類爲屬性值爲no的q元素定義引號的類型：

<html>

<head>

</head>

<body>

<p>文字<qlangqlang="no">段落中的引用的文字</q>文字</p>

</body>

</html>

1. css僞類用法
2. css僞類及僞元素用法
3. CSS僞類
4. css 僞類
5. CSS——僞類
6. CSS----僞類
7. CSS的僞類
8. css僞類
9. CSS :active 僞類
10. Css僞類
更多相關文章...
• jQuery Mobile CSS 類 - jQuery Mobile 教程
• CSS 指南 - 網站建設指南
• Kotlin學習（一）基本語法
• Kotlin學習（二）基本類型

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。