有關(guān)a標(biāo)簽的顏色、字體繼承問題

sixgo 發(fā)布于2019-08-29 12:20 / 3166人閱讀

摘要：在中嵌套元素和元素，設(shè)置樣式如下設(shè)置字體顏色不會(huì)被標(biāo)簽繼承，因?yàn)闃?biāo)簽有默認(rèn)樣式由于的層疊，元素繼承自的樣式被瀏覽器的元素的默認(rèn)樣式鏈接默認(rèn)顏色為，字體帶下劃線給覆蓋了。

在div中嵌套p元素和a元素，設(shè)置樣式如下


    this is paragraph
    this is a link

div {
    /*設(shè)置字體顏色不會(huì)被a標(biāo)簽繼承，因?yàn)閍標(biāo)簽有默認(rèn)樣式*/
    color: red;
    background-color: #ccc;
    font: 20px Verdana,Helvitica,sans-serif;
}

由于CSS的層疊（cascading），a元素繼承自div的樣式（color:red）被瀏覽器的a元素的默認(rèn)樣式（鏈接默認(rèn)顏色為blue，字體帶下劃線）給覆蓋了。

想要更改鏈接顏色有兩種方式

1.更改a標(biāo)簽的默認(rèn)樣式：

div {
    color: red;
    background-color: #ccc;
    font: 20px Verdana,Helvitica,sans-serif;
}
/*更改a標(biāo)簽的默認(rèn)樣式*/
a {
    color: black;
}

2.將a標(biāo)簽的默認(rèn)樣式更改為繼承color: inherit;

a {
    color: inherit;
}

參考資料
CSS 中 a 標(biāo)簽為什么不能繼承父類的顏色？
CSS層疊-MDN
《CSS權(quán)威指南》第三章

GPU云服務(wù)器云服務(wù)器 html的字體顏色看apue遇到的有關(guān)問題 html標(biāo)簽的顏色是 asp改字體顏色

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/111823.html

相關(guān)文章

CSS簡(jiǎn)潔筆記

摘要：層疊性發(fā)生的前提樣式?jīng)_突優(yōu)先級(jí)權(quán)重行內(nèi)引入標(biāo)簽通用把權(quán)重相加，值越大越有先權(quán)重一樣，后面的樣式起作用補(bǔ)充知識(shí)筆記表單優(yōu)化寫法用戶名格式化列表圖標(biāo)表單合并設(shè)置表格邊框合并，適用于表格格式化上下文默認(rèn)值。 1.通用屬性 name：名稱，可以重復(fù)，可以一樣; class：類名，可以重復(fù)，也可以擁有多個(gè)，給CSS用的；如; id：唯一標(biāo)示，不能重復(fù)，一般多用在JavaScript中；命名規(guī)...

yanbingyun1990 2019-08-02 16:00 評(píng)論0 收藏0
CSS簡(jiǎn)潔筆記

摘要：層疊性發(fā)生的前提樣式?jīng)_突優(yōu)先級(jí)權(quán)重行內(nèi)引入標(biāo)簽通用把權(quán)重相加，值越大越有先權(quán)重一樣，后面的樣式起作用補(bǔ)充知識(shí)筆記表單優(yōu)化寫法用戶名格式化列表圖標(biāo)表單合并設(shè)置表格邊框合并，適用于表格格式化上下文默認(rèn)值。 1.通用屬性 name：名稱，可以重復(fù)，可以一樣; class：類名，可以重復(fù)，也可以擁有多個(gè)，給CSS用的；如; id：唯一標(biāo)示，不能重復(fù)，一般多用在JavaScript中；命名規(guī)...

FullStackDeveloper 2019-08-29 14:01 評(píng)論0 收藏0
CSS學(xué)習(xí)筆記(四) CSS優(yōu)先級(jí)

摘要：為了解決沖突，確定哪條規(guī)則勝出并最終被應(yīng)用，提供了三種機(jī)制繼承層疊和特指。整個(gè)檢查更新過程結(jié)束后，再將每個(gè)標(biāo)簽以最終設(shè)定的樣式顯示出來。層疊規(guī)則四順序決定權(quán)重。規(guī)則三設(shè)定的樣式勝過繼承的樣式，此時(shí)不用考慮特指度即顯式設(shè)定優(yōu)先。為了解決沖突，確定哪條規(guī)則勝出并最終被應(yīng)用，CSS提供了三種機(jī)制：繼承、層疊和特指。 1.繼承 CSS 中的祖先元素會(huì)向后代傳遞一樣?xùn)|西：CSS屬性...

高勝山 2019-08-28 18:01 評(píng)論0 收藏0
前端基礎(chǔ)入門二（CSS）

摘要：輸入的時(shí)候少按一個(gè)鍵瀏覽器兼容問題比如使用的選擇器命名，在是無(wú)效的能良好區(qū)分變量命名變量命名是用不要純數(shù)字中文等命名，盡量使用英文字母來表示。選擇器和類選擇器最大的不同在于使用次數(shù)上。當(dāng)需要設(shè)置英文字體時(shí)，英文字體名必須位于中文字體名之前。回顧上一節(jié)HTML 思維導(dǎo)圖 showImg(https://segmentfault.com/img/bVbno3O?w=1378&h=1178...

Lorry_Lu 2019-08-30 15:55 評(píng)論0 收藏0
CSS超全筆記（適合新手入門）

摘要：選擇器和類選擇器區(qū)別標(biāo)準(zhǔn)規(guī)定，在同一個(gè)頁(yè)面內(nèi)，不允許有相同名字的對(duì)象出現(xiàn)，但是允許相同名字的。選擇器和類選擇器最大的不同在于使用次數(shù)上。當(dāng)需要設(shè)置英文字體時(shí)，英文字體名必須位于中文字體名之前。CSS CSS初識(shí) CSS(Cascading Style Sheets) 美化樣式 CSS通常稱為CSS樣式表或?qū)盈B樣式表（級(jí)聯(lián)樣式表），主要用于設(shè)置HTML頁(yè)面中的文本內(nèi)容（字體、大小、對(duì)齊方式等）...

番茄西紅柿 2019-04-23 11:56 評(píng)論0 收藏0