這篇文章主要介紹了css中屬性值繼承的示例分析，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

創(chuàng)新互聯(lián)公司專業(yè)為企業(yè)提供柏鄉(xiāng)網(wǎng)站建設(shè)、柏鄉(xiāng)做網(wǎng)站、柏鄉(xiāng)網(wǎng)站設(shè)計(jì)、柏鄉(xiāng)網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計(jì)與制作、柏鄉(xiāng)企業(yè)網(wǎng)站模板建站服務(wù)，十余年柏鄉(xiāng)做網(wǎng)站經(jīng)驗(yàn)，不只是建網(wǎng)站，更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。

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

1.css可以和不可以繼承的屬性

不可繼承的：display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、page-bread-before和unicode-bidi。
所有元素可繼承：visibility和cursor。
內(nèi)聯(lián)元素可繼承：letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction。
終端塊狀元素可繼承：text-indent和text-align。
列表元素可繼承：list-style、list-style-type、list-style-position、list-style-image。
表格元素可繼承：border-collapse。 

2.值的繼承

繼承也是基于文檔樹的，文檔樹中元素的某些屬性可以被其子元素繼承，每一個(gè)CSS屬性都定義了它能否被繼承。要設(shè)定文檔的某些缺省樣式屬性，可以在文檔樹的根上設(shè)定該屬性，如果這個(gè)屬性可以繼承，則其后代元素將繼承這個(gè)屬性，例如color、font-size等屬性。

3.“inherit（繼承）”值

每一個(gè)屬性可以指定值為“inherit”，即：對(duì)于給定的元素，該屬性和它父元素相對(duì)屬性的計(jì)算值取一樣的值。繼承值通常只用作后備值，它可以通過顯式地指定“inherit”而得到加強(qiáng)，例如：

         p { font-size: inherit; }

4.繼承的局限性

繼承雖然減少了重復(fù)定義的麻煩，但是，有些屬性是不能繼承的，例如border（邊框）、margin（邊距）、padding（補(bǔ)白）和背景等。
這樣設(shè)定是有道理的，例如，為一個(gè)<div>設(shè)定了邊框，如果此屬性也繼承的話，那么在這個(gè)<div>內(nèi)所有的元素都會(huì)有邊框，這無疑會(huì)產(chǎn)生一個(gè)讓人眼花繚亂的結(jié)果。同樣的，影響元素位置的屬性，例如margin（邊距）和padding（補(bǔ)白），也不會(huì)被繼承。

同時(shí)，瀏覽器的缺省樣式也在影響著繼承的結(jié)果。例如：

     body { font-size: 12px; }

       <h3>2級(jí)標(biāo)題的文字不是12px。

      // </h3> H2中文字將是標(biāo)題2樣式的文字而非12px大小的文字。

這是因?yàn)闉g覽器的缺省樣式設(shè)定了<h3>的CSS規(guī)則。

同時(shí)，有些老版本的瀏覽器可能對(duì)繼承支持的不太好，例如某些瀏覽器當(dāng)遇到<table>的時(shí)候，就會(huì)丟失所有的繼承的屬性

5.能否取消

css屬性一旦繼承了不能被取消，只能重新定義樣式。

6.案例

父元素position:relative 子元素：position:absolute 父元素寬度固定，子元素會(huì)繼承父元素的寬度（對(duì)于二級(jí)導(dǎo)航很重要，當(dāng)隱藏的那個(gè)導(dǎo)航欄寬度不固定，或者寬度大于父元素時(shí)，此時(shí)一般只能重新設(shè)置子元素的寬度）

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“css中屬性值繼承的示例分析”這篇文章對(duì)大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司，，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識(shí)等著你來學(xué)習(xí)!

文章標(biāo)題：css中屬性值繼承的示例分析-創(chuàng)新互聯(lián)
網(wǎng)站網(wǎng)址：http://aaarwkj.com/article14/dedsde.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站制作、小程序開發(fā)、外貿(mào)網(wǎng)站建設(shè)、網(wǎng)站改版、企業(yè)網(wǎng)站制作、企業(yè)建站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)