tft每日頭條

 > 圖文

 > css的層疊性舉例

css的層疊性舉例

圖文 更新时间:2024-11-25 23:00:24

提起“層疊”,首先能讓我想到什麼呢?

css的層疊性舉例(層疊樣式表中的)1

深夜還饑腸辘辘的你,是不是又在放毒了。 那我們就言歸正傳,上圖就能很清楚地表達出我所說層疊的含義, 相信看到這裡你也會印象深刻。

就是一層覆蓋着一層,在CSS中的含義是每一個元素的屬性隻可以被層層覆蓋, 低優先的層級被高優先的層級所覆蓋。 舉例來說,比如網頁中的一個段落,在Interal CSS中定義的樣式是它的背景顔色是透明的, 但是在Inline CSS中它的背景顔色是藍色的, 最終網頁展現在用戶面前的背景顔色是藍色的,原因我之前講過Inline CSSInteral CSS的優先級來的高。 所以藍色覆蓋了透明色

HTML中的一個元素的某一個樣式屬性,它可能有很多的不同的屬性值, 它們之間存在相互競争的關系, 最終渲染出來的結果是由浏覽器将該屬性值按次序(從低優先到高優先)一一列舉,最後的幸存者獲勝(最後一個申明的屬性值)

在CSS中有三種類型的樣式表, 分别是 User-agent style sheets, Author stylesheets, 和User stylesheets (這裡我就不按字面翻譯了)

User-agent stylesheets

這種是浏覽器默認自帶的樣式,一般來說優先級最低。不同的浏覽器自帶的樣式會有所不同,但這種不同非常細微。 既然我們網頁開發人員可以編寫CSS,為什麼還需要浏覽器默認的樣式表呢? 原因用它來兜底, 當出現網頁開發人員定義的CSS找不到或加載錯誤的時候, 浏覽器會用降級用它自己默認的樣式表來呈現網頁中的内容

Author stylesheets

這種樣式表是網頁開發人員編寫的CSS,它的優先級高于浏覽器自帶樣式表

User stylesheets

用戶樣式表是指最終用戶在浏覽器上設置的樣式表,它具有最高的優先級。能夠覆蓋前兩種樣式表。 這種樣式表存在的意義,一般來說,是對于殘障人士提高他們使用和浏覽網頁的體驗而産生的。 比如超大字體和超高對比度,這些對于我們一般用戶來說都用不到,但對于他們來說則是必須。 因為是用戶設置的樣式表, 所以應用僅局限于用戶本地(其他用戶不會受到影響)

,

更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!

查看全部

相关圖文资讯推荐

热门圖文资讯推荐

网友关注

Copyright 2023-2024 - www.tftnews.com All Rights Reserved