国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

偽類和偽元素的區別

starsfun / 3524人閱讀

摘要：偽元素用于將特殊的效果添加到某些選擇器。因此，偽類與偽元素的區別在于有沒有創建一個文檔樹之外的元素。偽類代表了一組兄弟元素中的第一個元素。偽類的實質就是把某種幻想類關聯到某種偽類相關的元素中。

在css2中是這樣定義二者的：

CSS 偽類用于向某些選擇器添加特殊的效果。
CSS 偽元素用于將特殊的效果添加到某些選擇器。

偽類存在的意義是為了通過選擇器找到那些不存在DOM樹中的信息以及不能被常規CSS選擇器獲取到的信息。

第一點講的是獲取不存在與DOM樹中的信息。比如標簽的:link、visited等，這些信息不存在與DOM樹結構中，只能通過CSS選擇器來獲取；

第二點講的是獲取不能被常規CSS選擇器獲取的信息。比如偽類:target，它的作用是匹配文檔(頁面)的URI中某個標志符的目標元素。

target:URL 帶有后面跟有錨名稱 #，指向文檔內某個具體的元素。這個被鏈接的元素就是目標元素(target element)。
:target 選擇器可用于選取當前活動的目標元素。

    
    
  • 123
    • 
    
  •

li:first-child類似于

    
    
  • 123
    • 
    
  •

li.first-child 一樣
這個時候，被修飾的

  • 元素依然處于文檔樹中。

      
    123

    ul:first-letter類似于

      
    1
    23

    ul:first-letter被修飾的時候，元素并不處于文檔樹中。

    因此，偽類與偽元素的區別在于：有沒有創建一個文檔樹之外的元素。

    :first-child CSS偽類
    代表了一組兄弟元素中的第一個元素。在level3實現中，被匹配的元素需要具有一個父級元素，而在level4實現中則不需要
    

    :first-child 匹配的是某父元素的第一個子元素，可以說是結構上的第一個子元素。

    p:first-child，常見的錯誤理解是這個選擇器是選擇p的第一個元素。

    偽類的實質就是把某種幻想類關聯到某種偽類相關的元素中。

    :first-of-type 匹配的是該類型的第一個，類型是指什么呢，就是冒號前面匹配到的東西，比如 p:first-of-type，就是指所有p元素中的第一個。這里不再限制是第一個子元素了，只要是該類型元素的第一個就行了，當然這些元素的范圍都是屬于同一級的，也就是同輩的。
    同樣類型的選擇器 :last-child  和 :last-of-type、:nth-child(n)  和  :nth-of-type(n) 也可以這樣去理解。
    偽元素

    偽元素包括:first-letter, :first-line, :before ,:after等

    所有的偽元素都要寫在偽元素選擇器的最后面，如果這樣寫就會出錯，

    p:first-letter em{
    
}

    這是不允許的。

    • 文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

    轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/113135.html

    相關文章

    • 詳解 CSS 屬性 - 偽類和偽元素的區別

      摘要：之前寫了一篇詳解屬性的博文，當時自己沒分清楚偽元素和偽類，所以在文章內把概念混淆了，慶幸兄指正了我的錯誤，所以今天打算好好研究下兩者的區別。偽元素用于將特殊的效果添加到某些選擇器。偽類種類偽元素種類區別這里用偽類和偽元素來進行比較。 之前寫了一篇 《詳解 CSS 屬性 - :before && :after》 的博文，當時自己沒分清楚偽元素和偽類，所以在文章內把概念混淆了，慶幸 @ri...

      jiekechoo 評論0 收藏0

    • 詳解 CSS 屬性 - 偽類和偽元素的區別

      摘要：之前寫了一篇詳解屬性的博文，當時自己沒分清楚偽元素和偽類，所以在文章內把概念混淆了，慶幸兄指正了我的錯誤，所以今天打算好好研究下兩者的區別。偽元素用于將特殊的效果添加到某些選擇器。偽類種類偽元素種類區別這里用偽類和偽元素來進行比較。 之前寫了一篇 《詳解 CSS 屬性 - :before && :after》 的博文，當時自己沒分清楚偽元素和偽類，所以在文章內把概念混淆了，慶幸 @ri...

      AZmake 評論0 收藏0

    • CSS3偽類和偽元素

      作為一個CSS3初學不久者來說，很容易混淆單冒號（:）和雙冒號（::）的用法，以為兩者可以互換著來使用。我自己之前也混淆過他們，因為兩者看起來太相像了，就像孿生兄弟。但實際上，他們的區別還是挺大的，最多算得上近房親戚。 下面我們來開始講講單冒號（:）偽類和雙冒號（::）偽元素有什么相同和不同點（另外在CSS2中單冒號: 也叫做偽對象，具體可看看http://www.mb5u.com/tool/cs...

      mozillazg 評論0 收藏0

    • 我終于理解了偽類和偽元素

      摘要：偽類和偽元素，對于絕大多數同學來說，都是耳熟能詳的名字，但確實又有很多人搞不清楚它們之間的區別，以致于混淆概念。除了上面這個本質區別以外，在中，偽類用單冒號表示而偽元素用雙冒號表示。 showImg(https://segmentfault.com/img/bV4WC1?w=510&h=310); 偽類和偽元素，對于絕大多數同學來說，都是耳熟能詳的名字，但確實又有很多人搞不清楚它們之間...

      張遷 評論0 收藏0

    • CSS基礎篇-- :before && :after的用法，偽類和偽元素的區別

      摘要：一的用法如同對偽元素的名稱一樣，是用來給指定的元素的內容前面插入新的內容。二偽類和偽元素的區別偽類種類偽元素種類偽類作用對象是整個元素例如盡管這些條件不是基于的，但結果每一個都是作用于一個完整的元素，比如整個鏈接，段落，等等。 一：:before && :after的用法 :before 如同對偽元素的名稱一樣，:before 是用來給指定的元素的內容前面插入新的內容。舉例說明： .b...

      X_AirDu 評論0 收藏0

    發表評論

    0條評論

    最新活動
    閱讀需要支付1元查看
    <