萬盛學電腦網 >> 網頁制作 >> DivCSS教程 >> CSS層疊樣式表的層疊是什麼意思
CSS層疊樣式表的層疊是什麼意思
基本上層疊的意思就是“繼承”、“權重”、“覆蓋”，通過良好的層級命名更好的實現效果，更少的代碼，更多的功能，下面為大家詳細介紹下，感興趣的朋友不要錯過
解答一：
層疊指的是樣式的優先級，當產生沖突時以優先級高的為准。
1. 開發者樣式>讀者樣式>浏覽器樣式（除非使用!important標記 ）
2. id選擇符>（偽）類選擇符>元素選擇符
3. 權重相同時取後面定義的樣式
以下是一段經典的html，三個類名分別為模塊、標題和正文。
<div class="mod">
<div class="hd"></div>
<div class="bd"></div>
</div>
大部分html頁面都可以由這種結構嵌套或者累加而成。
解答二：
CSS層疊是指CSS樣式在針對同一元素配置同一屬性時，依據層疊規則（權重）來處理沖突，選擇應用權重高的CSS選擇器所指定的屬性，一般也被描 述為權重高的覆蓋權重低的，因此也稱作層疊。每個CSS選擇器都會有一個權重（行內1000，id100，class10，tag1、可以這樣認為），當 兩個選擇器同時配置同一元素的同一屬性時（比如一個設置color：red，另一個color：black），就會產生沖突，而解決沖突的方案就是CSS 選擇器的權重，權重高的來覆蓋權重低的。
另外，繼承的屬性是權重重最輕的，會被上面的四個定義方式覆蓋。
CSS語義化其實更多地是指HTML的語義化。 比如下面的一個代碼我們這樣寫：
<div class="box">
<div class="h2">這是區塊標題</div>
<div class="bd">這是區塊內容</div>
<div>
但是語義化的寫法更能使得 robot識別網頁的結構，下面是語義化的寫法：
<section>
<h2>這是區塊標題</h2>
<p>這是區塊內容</p>
</section>
對 於robot來說，它能夠識別section（區塊）、h2(二級標題)、p(文字段落)，但是不能識別出div所包含的內容，因為div這個標記本身是 無語義的（必要時通過class或id屬性來賦予語義，但是這是次優選擇）。 而HTML5新增的article、header、footer、nav、section等標簽就是豐富了HTML原生的語義標簽，在很大程度上滿足了 HTML編寫的需要。
解答三：
我的理解是，層疊指的是上級標簽的樣式會自動繼承到其所有下級標簽，如針對<body>設置的標簽選擇器所設的字體樣式會自動應用到<body>下的<p>中，除非<p>重寫了相關樣式將其覆蓋。
CSS語義化的命名是指用易於理解的名稱對html標簽附加的class或id命名，如對於頁面上方的<div>，可將其id設為header；頁面下方的<div>設為footer，可以增強CSS的可維護性。
基本上層疊的意思就是“繼承”、“權重”、“覆蓋”，通過良好的層級命名更好的實現效果，更少的代碼，更多的功能
