展開(kāi)
湖北國(guó)聯(lián)計(jì)算機(jī)科技有限公司
  • 首頁(yè)HOME
  • 公司簡(jiǎn)介INTRODUCTION
  • 安全防御DEFENSE
  • 軟件開(kāi)發(fā)SOFTWARE
  • 物聯(lián)網(wǎng)IOT
  • 運(yùn)行維護(hù)SRE
  • 成功案例CASE
  • 聯(lián)系我們CONTACT
  • Software Technology Sharing |技術(shù)分享

    關(guān)于CSS樣式的哪些事----CSS的繼承性和層疊性
    來(lái)源:荊州網(wǎng)站建設(shè) 時(shí)間:2017-07-29

    CSS的繼承性

    我們來(lái)看下面這樣的代碼,來(lái)引入繼承性:


    上方代碼中,我們給div標(biāo)簽增加紅色屬性,卻發(fā)現(xiàn),div里的每一個(gè)子標(biāo)簽<p>也增加了紅色屬性。于是我們得到這樣的結(jié)論:

    有一些屬性,當(dāng)給自己設(shè)置的時(shí)候,自己的后代都繼承上了,這個(gè)就是繼承性。

    繼承性是從自己開(kāi)始,直到最小的元素。

    但是呢,如果再給上方的代碼加一條屬性:


    上圖中,我們給div加了一個(gè)border,但是發(fā)現(xiàn)只有div具備了border屬性,而p標(biāo)簽卻沒(méi)有border屬性。于是我們可以得出結(jié)論:

    以后當(dāng)我們談到css有哪些特性的時(shí)候,我們要首先想到繼承性。而且,要知道哪些屬性具有繼承性、哪些屬性沒(méi)有繼承性。

    CSS的層疊性

    層疊性:計(jì)算權(quán)重

    很多公司如果要筆試,那么一定會(huì)考層疊性。

    層疊性:就是css處理沖突的能力。 所有的權(quán)重計(jì)算,沒(méi)有任何兼容問(wèn)題!

    CSS像藝術(shù)家一樣優(yōu)雅,像工程師一樣嚴(yán)謹(jǐn)。

    我們來(lái)看一個(gè)例子,就知道什么叫層疊性了。


    上圖中,三種選擇器同時(shí)給P標(biāo)簽增加顏色的屬性,但是,文字最終顯示的是藍(lán)色,這個(gè)時(shí)候,就出現(xiàn)了層疊性的情況。

    當(dāng)多個(gè)選擇器,選擇上了某個(gè)元素的時(shí)候,要按照如下順序統(tǒng)計(jì)權(quán)重:

    id的數(shù)量,類(lèi)的數(shù)量,標(biāo)簽的數(shù)量

    因?yàn)閷?duì)于相同方式的樣式表,其選擇器排序的優(yōu)先級(jí)為:ID選擇器 > 類(lèi)選擇器 > 標(biāo)簽選擇器。

    以上內(nèi)容由湖北國(guó)聯(lián)計(jì)算機(jī)科技有限公司荊州網(wǎng)站建設(shè)荊州軟件開(kāi)發(fā)組小編整理轉(zhuǎn)載。歡迎伙伴們一起交流。郵箱:business@gl-ns.com

    荊州地區(qū)政府網(wǎng)站建設(shè) 解決方案 專(zhuān)業(yè)團(tuán)隊(duì) 騰訊第三方平臺(tái) 地址:湖北省荊州市沙市區(qū)荊沙大道楚天都市佳園一期C區(qū)29棟112       地址:湖北省松滋市新江口街道才知文化廣場(chǎng)1幢1146-1151室     郵編:434200 聯(lián)系電話:0716-6666211     網(wǎng)站編輯部郵箱:business@gl-ns.com 鄂公網(wǎng)安備 42100202000212號(hào) 備案號(hào):鄂ICP備2021015094號(hào)-1     企業(yè)名稱(chēng):湖北國(guó)菱計(jì)算機(jī)科技有限公司