您好,登錄后才能下訂單哦!
本文小編為大家詳細(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è)資訊頻道。
免責(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)容。