|
導讀網頁的本質就是超級文本標記語言,通過結合使用其他的Web技術(如:腳本語言、公共網關接口、組件等),可以創造出功能強大的網頁。因而,超級文本標記語言是萬維網(Web)編程的基礎,也就是說萬維網是建立... 網頁的本質就是超級文本標記語言,通過結合使用其他的Web技術(如:腳本語言、公共網關接口、組件等),可以創造出功能強大的網頁。因而,超級文本標記語言是萬維網(Web)編程的基礎,也就是說萬維網是建立在超文本基礎之上的。超級文本標記語言之所以稱為超文本標記語言,是因為文本中包含了所謂“超級鏈接”點。 作為前端工程師,對于CSS 選擇器并不陌生吧。選擇器是我們在布局時必不可少的一部分。那你知道CSS中的選擇器有哪些嗎?CSS選擇器的優先級順序又是怎么樣的呢?當你知道了其中的奧秘,才能在工作中得心應手。接下來就聊聊CSS選擇器以及他們的優先級順序。一、CSS選擇器有哪些 CSS中的選擇器很多,比如:ID選擇器,類選擇器,通配符選擇器,偽類選擇器等等,接下來主要介紹常用的幾個。 1.標簽選擇器 語法:標簽名{} ,eg:h1{} //為所有的h1元素設置樣式。 2.ID選擇器 語法:#id名{} //id值唯一不能重復 , eg : #top{} //為id為top的元素設置樣式。 3.類選擇器 語法:.class{} , eg: .box{} //為所有的class值為box的元素設置樣式。 4.組選擇器 語法:選擇器1,選擇器2,選擇器N{} , eg: #box1,.box2,p{} //為id為box1,class為box2和p的元素共同設置樣式。 5、通配符選擇器 語法:*{} ,eg:*{font-size:16px } //將整個頁面字體大小設為16px。 6.后代選擇器 語法:選擇器1 選擇器2{} , eg:p .aa{} //選中指定祖先元素p的指定后代.aa。 7.子元素選擇器 語法:父元素>子元素{} , eg:p>.box{} //選中父元素p的指定子元素.box。注意與后代元素選擇器的區別 8.偽類選擇器 偽類可以用來表示一些特殊的狀態,如: eg:a:hover{color:red} //鼠標經過a標簽時,顏色變為紅色。 二、CSS選擇器的優先級順序 當同一屬性的不同值都作用到了同一個元素時,如果定義的屬性之間有沖突,那么應該用誰的值的,這個時候就涉及到CSS的優先級順序了。 總結排序:!important > 內部樣式>ID選擇器 > 類選擇器 > 標簽選擇器> 通配符選擇器 > 繼承 > 瀏覽器默認屬性 小結:以上總結了CSS中常用的選擇器以及他們的語法規則。至于選擇器的優先級順序,這里只給出了最終結論,還需要小伙伴們自己親自動手嘗試,這里不做示范。希望這個教程可以幫助到你! 以上就是CSS中的選擇器有哪些?你知道選擇器的優先級順序嗎?的詳細內容,更多請關注php中文網其它相關文章! 網站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。 |
溫馨提示:喜歡本站的話,請收藏一下本站!