国产一区二区精品-国产一区二区精品久-国产一区二区精品久久-国产一区二区精品久久91-免费毛片播放-免费毛片基地

千鋒教育-做有情懷、有良心、有品質(zhì)的職業(yè)教育機構(gòu)

手機站
千鋒教育

千鋒學(xué)習(xí)站 | 隨時隨地免費學(xué)

千鋒教育

掃一掃進入千鋒手機站

領(lǐng)取全套視頻
千鋒教育

關(guān)注千鋒學(xué)習(xí)站小程序
隨時隨地免費學(xué)習(xí)課程

當(dāng)前位置:首頁  >  應(yīng)聘面試  >  html5面試題  > 前端面試篇:CSS選擇符有哪些?哪些屬性可以繼承?優(yōu)先級算法如何計算

前端面試篇:CSS選擇符有哪些?哪些屬性可以繼承?優(yōu)先級算法如何計算

來源:千鋒教育
發(fā)布人:syq
時間: 2022-07-13 13:27:15 1657690035

  · CSS選擇符(就是選擇器)

  o 基礎(chǔ)選擇器

  通配符選擇器 *{}

  標(biāo)簽選擇器標(biāo)簽名 p{}

  class類選擇器 .class屬性值{}

  多類名選擇器 .類名n{} 標(biāo)簽中class屬性為 class="類名1 類名2 ... 類名n"

  id選擇器 #id屬性值{}

  群組選擇器 選擇器1,選擇器2,...{}

  o 結(jié)構(gòu)選擇器

  子元素選擇器E>F{} F必須是E的子元素

  后代選擇器E F{} F必須是E的后代

  相鄰兄弟選擇器E+F{} F是緊挨這E后面的兄弟元素

  通用選擇器E~F{} F是E后面所有的兄弟元素

CSS選擇符有哪些

  o 屬性選擇器

  [Eattr] 元素E中存在attr屬性

  [Eattr="value"] 元素E中存在attr屬性,并且attr的屬性值為value

  [Eattr~="value"] 元素E中存在attr屬性,并且attr的屬性值為value或者"value value1 ..."的形式

  [Eattr^="value"] 元素E中存在attr屬性,并且attr的屬性值以value開始

  [Eattr$="value"] 元素E中存在attr屬性,并且attr的屬性值以value結(jié)尾

  [Eattr*="value"] 元素E中存在attr屬性,并且attr的屬性值存在value

  [Eattr|="value"] 元素E中存在attr屬性,并且attr的屬性值為value或者value-的形式

  o 結(jié)構(gòu)偽類選擇器

  X:first-child 匹配子集的第一個元素

  X:last-child匹配父元素中最后一個X元素

  X:nth-child(n)用于匹配索引值為n的子元素。索引值從1開始

  X:only-child這個偽類一般用的比較少,比如上述代碼匹配的是div下的有且僅有一個的p,也就是說,如果div內(nèi)有多個p,將不匹配。

  X:root匹配文檔的根元素。在HTML(標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用)中,根元素永遠是HTML

  X:empty匹配沒有任何子元素(包括包含文本)的元素

  o 目標(biāo)偽類

  E:target 選擇匹配E的所有元素,且匹配元素被相關(guān)URL指向

  o UI狀態(tài)偽類

  E:enabled 匹配所有用戶界面(form表單)中處于可用狀態(tài)的E元素

  E:disabled 匹配所有用戶界面(form表單)中處于不可用狀態(tài)的E元素

  E:checked 匹配所有用戶界面(form表單)中處于選中狀態(tài)的元素E

  E:selection 匹配E元素中被用戶選中或處于高亮狀態(tài)的部分

  o 否定偽類

  E:not(s) (IE6-8瀏覽器不支持:not()選擇器。)匹配所有不匹配簡單選擇符s的元素E

  o 動態(tài)偽類

  E:link 鏈接偽類選擇器 選擇匹配的E元素,而且匹配元素被定義了超鏈接并未被訪問過。常用于鏈接描點上

  E:visited 鏈接偽類選擇器 選擇匹配的E元素,而且匹配元素被定義了超鏈接并已被訪問過。常用于鏈接描點上

  E:active 用戶行為選擇器 選擇匹配的E元素,且匹配元素被激活。常用于鏈接描點和按鈕上

  E:hover 用戶行為選擇器 選擇匹配的E元素,且用戶鼠標(biāo)停留在元素E上。IE6及以下瀏覽器僅支持a:hover

  E:focus 用戶行為選擇器 選擇匹配的E元素,而且匹配元素獲取焦點

  · 屬性繼承

  o 繼承:html元素可以從父元素那里繼承一部分css屬性,即使當(dāng)前元素沒有定義該屬性。

  1.字體系列屬性 font,font-family,font-weight,font-size,font-style

  2.文本系列屬性 text-indent,text-align,line-height,word-spacing,letter-spacing,text-transform,color

  3.元素可見性 visibility

  4.表格布局屬性 caption-side,border-collapse,border-spacing,empty-cells,table-layout

  5.列表布局屬性 list-style-type,list-style-image,list-style-position,list-style

  · 選擇器優(yōu)先級的算法

  o 優(yōu)先級就近原則,同權(quán)重情況下樣式定義最近者為準(zhǔn);

  o 載入樣式以最后載入的定位為準(zhǔn);

  o 優(yōu)先級為:同權(quán)重: 內(nèi)聯(lián)樣式表(標(biāo)簽內(nèi)部)> 嵌入樣式表(當(dāng)前文件中)> 外部樣式表(外部文件中)。

  o !important > id > class > tag important 比內(nèi)聯(lián)優(yōu)先級高。

  更多關(guān)于“前端培訓(xùn)”的問題,歡迎咨詢千鋒教育在線名師。千鋒教育多年辦學(xué),課程大綱緊跟企業(yè)需求,更科學(xué)更嚴(yán)謹(jǐn),每年培養(yǎng)泛IT人才近2萬人。不論你是零基礎(chǔ)還是想提升,都可以找到適合的班型,千鋒教育隨時歡迎你來試聽。

tags:
聲明:本站稿件版權(quán)均屬千鋒教育所有,未經(jīng)許可不得擅自轉(zhuǎn)載。
10年以上業(yè)內(nèi)強師集結(jié),手把手帶你蛻變精英
請您保持通訊暢通,專屬學(xué)習(xí)老師24小時內(nèi)將與您1V1溝通
免費領(lǐng)取
今日已有369人領(lǐng)取成功
劉同學(xué) 138****2860 剛剛成功領(lǐng)取
王同學(xué) 131****2015 剛剛成功領(lǐng)取
張同學(xué) 133****4652 剛剛成功領(lǐng)取
李同學(xué) 135****8607 剛剛成功領(lǐng)取
楊同學(xué) 132****5667 剛剛成功領(lǐng)取
岳同學(xué) 134****6652 剛剛成功領(lǐng)取
梁同學(xué) 157****2950 剛剛成功領(lǐng)取
劉同學(xué) 189****1015 剛剛成功領(lǐng)取
張同學(xué) 155****4678 剛剛成功領(lǐng)取
鄒同學(xué) 139****2907 剛剛成功領(lǐng)取
董同學(xué) 138****2867 剛剛成功領(lǐng)取
周同學(xué) 136****3602 剛剛成功領(lǐng)取
相關(guān)推薦HOT
快速通道