溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

CSS中的inherit關(guān)鍵字怎么用

發(fā)布時(shí)間:2022-03-10 15:18:00 來源:億速云 閱讀:120 作者:iii 欄目:web開發(fā)

本文小編為大家詳細(xì)介紹“CSS中的inherit關(guān)鍵字怎么用”,內(nèi)容詳細(xì),步驟清晰,細(xì)節(jié)處理妥當(dāng),希望這篇“CSS中的inherit關(guān)鍵字怎么用”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學(xué)習(xí)新知識(shí)吧。

  inherit關(guān)鍵字

  由于CSS的級(jí)聯(lián)性質(zhì),一些CSS屬性會(huì)自動(dòng)從元素的父級(jí)繼承它們的值。例如設(shè)置元素的文本顏色,則該元素的所有后代將繼承相同的文本顏色。即使某些屬性值是自動(dòng)繼承的,也可能存在增加繼承屬性權(quán)重的情況。在這種情況下,使用inherit默認(rèn)情況下已經(jīng)繼承父值的屬性上的值將強(qiáng)制繼承父值。

  通過inherit關(guān)鍵字強(qiáng)制執(zhí)行自動(dòng)繼承的值的一種情況是用戶代理的樣式表覆蓋繼承的值(瀏覽器將某些元素應(yīng)用的默認(rèn)樣式)

  例如,文本的color值會(huì)自動(dòng)傳遞給元素的所有后代,但在a鏈接的情況下,該color屬性通常在用戶代理樣式表中設(shè)置為藍(lán)色。在大多數(shù)情況下,可以為鏈接應(yīng)用不同的顏色,或者是繼承與文本其余部分相同的顏色,并可能應(yīng)用另一個(gè)表明它們是鏈接的視覺效果(例如應(yīng)用下劃線或背景顏色等)。假設(shè)希望鏈接具有與文本其余部分相同的文本顏色,則可以使用該inherit值來強(qiáng)制執(zhí)行通常會(huì)繼承的顏色值。

  div{

  color:pink;

  }

  a{

  color:inherit;

  }

  某些CSS屬性不會(huì)繼承元素父級(jí)的計(jì)算值,但是我們希望將元素的屬性值設(shè)置為與其父級(jí)的值相同。在這種情況下inherit關(guān)鍵字就派上用場(chǎng)了,它允許不自動(dòng)繼承值的屬性繼承它。

  例如,為元素設(shè)置了藍(lán)色邊框,并且希望其所有子元素div具有相同的邊框,那么就可以設(shè)置inherit關(guān)鍵字讓它們繼承與父元素相同的邊框顏色。

  .el{

  padding:10px;

  border:5pxsolid#0099cc;

  }

  .child{

  padding:10px;

  margin-top:20px;

  border:inherit;

  }

  .el-2{

  margin-top:30px;

  border:5pxsolidhotpink;

  }

  .child-2{

  border:5pxsolidinherit;

  margin-top:20px;

  }

讀到這里,這篇“CSS中的inherit關(guān)鍵字怎么用”文章已經(jīng)介紹完畢,想要掌握這篇文章的知識(shí)點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過才能領(lǐng)會(huì),如果想了解更多相關(guān)內(nèi)容的文章,歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI