作為第一篇技術乾貨，來寫哪個方面的內容，我著實考慮了很久。
經過了整整30秒的深思熟慮，我決定就我第一次發現新大陸一樣的內容，來進行一次討論。
簡單的使用：
1
<
div
id='ancestor'
>
2<
div
id="father"
>
3<
div
id="son"
>
4div
>
5div
>
6div
>78
<
style
>
9#ancestor
14#father
19#son
24#ancestor:hover
27style
>
這段**，十分簡單應該大家都能看的懂，效果也可以預知，下面我們就來做一點。
**變異：
1
<
div
id='ancestor'
>
2<
div
id="father"
>
3<
div
id="son"
>
4div
>
5div
>
6div
>78
<
style
>
9#ancestor
14#father
19#son
24#ancestor :hover
27style
>
或許乍一看，感覺這段**和之前的那一段一模一樣，但是其實有乙個很大的區別。
相信拷貝**去嘗試過的小夥伴們，已經開始疑惑了。那就讓我開始來嗶嗶一波吧。
其實仔細關注了這兩段**之後，可以發現區別實際是在 #ancestor:hover 這個選擇器上。第二段**只是多加了乙個空格。
很多同學肯定已經靈光一閃，彷彿已經明白了什麼。不過，還是我來提壺（醍醐）給大家灌個頂吧！
發生了什麼：
大家都知道選擇器中，空格就是後代選擇器。#ancestor :hover 所命中的，其實就是 #ancestor 所有後代元素的 :hover 屬性。所以在 #ancestor 自身上。沒有被新增到這個偽類，而 #father 、#son，被同時命中。就出現了大家所看到的效果。如果，想印證我的說法，可以使用 #ancestor>:hover 再做一次嘗試. 或者再次新增更多的後代元素.看看他們是否一樣有這個特殊效果。
至於我們最通常使用的 #ancestor:hover 這一種使用的方式，實際上就是兩個選擇器組成的交集選擇器，需要同時命中這兩個條件才被適用。
故而，我這一堆嗶嗶，也就是為了表明偽類、偽元素選擇器，其實和我們使用的id選擇器、類選擇器等等常見的選擇器一樣，可以使用各種關係符，來組成各種奇怪而又好用的選擇器。
這一堆嗶嗶，換來的實用性：
很多人這個時候已經在吐槽了。偽類，只有在一些特殊的場景之下才會使用到，並不會很常用。
我想說的是，偽類，並不僅僅是 :link:，:vistited，:hover，:active 等特殊狀態的。
還有一些，比如:first-child，:last-child，:nth-child 這些指向特定元素的。
在我們使用這些偽類時，例如 li:first-child
，會命中的是 li 標籤，同時必須是他自身父級的第乙個元素。所以，很多人都會加上乙個類名來實現給他的效果。
但是，如果我們這樣寫呢。 ul > :first-child
是不是就會顯的更有語義且優雅。
亦或者，ul > ::before
給所有的子集中增加乙個小箭頭
後話，嗶嗶了這麼久。其實實用性確實不是很高。我做這一篇隨筆主要意義是，希望新手能正常理解，偽類、偽元素，到底是乙個什麼樣的東西。其實它們並不特殊，和普通的選擇器是一模一樣的。不需要用特殊的眼光去看待他們。也不需要覺得它們有什麼特別的用法。將他們看成普通的選擇器，只不過他們命中的元素是一種特殊狀態。記住這一點就好。
至：所有對偽類，偽元素持懵逼狀態的各位。
CSS偽類選擇器
原來學習過css偽類選擇器，前幾天寫css發現自己並不熟悉了。這兩天把它撿起來複習一下 css偽類選擇器是用於向某些元素新增特定的效果。錨偽類 包括四種狀態，活動狀態，未被訪問狀態，已被訪問狀態，懸停效果。example a link a visited a hover a active fist ...
css偽類選擇器
link 設定超連結的預設樣式 例如 a a link 不推薦使用 有相容性 one link 不推薦使用 有相容性 visited 設定標籤被訪問過後的樣式 例如 a visited 注意 該偽類選擇器一般不會大量使用，因為瀏覽器存在快取問題。只能設定與顏色相關的屬性 hover 設定滑鼠懸停到標...
css偽類選擇器
名稱 說明ele not 匹配除了誰。裡面填條件，也就是選擇器。ele root 匹配根目錄的意思，在html裡是選 html標籤 ele target url錨點 指向文件內某個具體的元素。那麼該元素就會觸發 target ele first child 匹配父元素下的第乙個子元素必須有父元素，最...