亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

搜索

微信公眾號

首頁文章專題 AI工具學(xué)習(xí) 編程手冊下載最近更新

文章 web3.0 后端開發(fā) web前端數(shù)據(jù)庫開發(fā)工具 php框架常見問題科技 Java 系統(tǒng)教程電腦教程硬件教程手機教程軟件教程游戲教程自媒體新聞

專題后端開發(fā) web前端數(shù)據(jù)庫開發(fā)工具 php框架科技 Java 系統(tǒng)教程電腦教程硬件教程手機教程軟件教程游戲教程新聞

AI工具 AI 聊天問答 Agent智能體 AI 文本寫作 AI 繪畫作圖 AI 設(shè)計工具 AI 視頻創(chuàng)作 AI 音頻制作 AI 辦公學(xué)習(xí) AI 編程開發(fā) Prompt指令

學(xué)習(xí) 大前端后端開發(fā) 數(shù)據(jù)庫移動端運維開發(fā) UI設(shè)計計算機基礎(chǔ)

編程手冊大前端 JavaScript 后端開發(fā) 數(shù)據(jù)庫移動端運維開發(fā) UI設(shè)計計算機基礎(chǔ) XML Web Services

下載 js特效網(wǎng)站源碼工具下載類庫下載網(wǎng)站素材學(xué)習(xí)資源插件擴展手機/移動開發(fā) 手機游戲

簡介

css層疊樣式表為HTML或XML等標(biāo)記語言提供了一種樣式描述，定義了其中元素的顯示方式。css中的“層疊”表示，css樣式單中的樣式形成一個層次結(jié)構(gòu)，更具體的樣式覆蓋通用樣式。樣式規(guī)則的優(yōu)先級由css根據(jù)這個層次結(jié)構(gòu)決定，從而實現(xiàn)級聯(lián)效果。

CSS樣式表的來源

css樣式表的來源主要有兩大類，分別是用戶自定義樣式和用戶代理樣式。
用戶自定義樣式
顧名思義，就是用戶自己定義的樣式。在此大類中，樣式表的來源又分為3個小項

style=屬性，style屬性作為元素的屬性，直接寫在元素標(biāo)簽內(nèi)。
```
<h1 style="color: red">Hello World!</h1>
```
<style>標(biāo)簽，style標(biāo)簽作為HTML的一個元素，可用于控制其它元素的樣式。但是由于，它是寫在具體的HTML文檔內(nèi)，因此它只能控制當(dāng)前文檔的樣式，因此也稱為內(nèi)部樣式。<style>標(biāo)簽一般放在<head>標(biāo)簽內(nèi)。
```
<head>
 <meta charset="UTF-8">
 <title>Title</title>
 <style>
     h1 {
         color: brown;
     }
 </style>
</head>
```
引用外部樣式，顧名思義，就是引用外部的樣式表。何為外部樣式表？就是樣式作為一個單獨的文件，被保存在.css文件中。保存在此文件中的樣式，具有通用性比較強的特點。只要HTML文件中的元素，可以被該樣式表中的選擇器選中。那么該外部樣式，就可以控制相應(yīng)的元素的樣式。引用外部樣式，一般使用HTML中的<link>標(biāo)簽。
<link rel="stylesheet" href="style.css">
用戶代理樣式
還有一種樣式來源，被稱為用戶代理樣式。在使用中，用戶代理其實就是瀏覽器。因此也可以理解為瀏覽器默認(rèn)樣式。既然被稱為默認(rèn)樣式，就是瀏覽器自動添加的樣式，無需用戶管理。例如，HTML中的h1標(biāo)簽，顯示在瀏覽器時字體自動加大并加粗，a標(biāo)簽?zāi)J(rèn)添加下劃線等
CSS優(yōu)先級沖突的解決方案
css中的優(yōu)先級一般為 id > class > tag。我們可以將id的權(quán)重設(shè)為100，class的權(quán)重設(shè)為10，tag的權(quán)重設(shè)為1。這樣就可以通過選擇器的權(quán)重，確定選擇器的優(yōu)先級。舉例:
```
<style>
     body h1.title{
         color: red;
     }
     h1.title{
         color: yellow;
     }
     #head{
         color: blue;
     }
 </style>
<h1 class="title" id="head">Hello World!</h1>
```
h1.title的權(quán)重是 10×1+1=11
body h1.title的權(quán)重是 10×1+1×2=12
#head的權(quán)重是 100×1=100
那么在這三個選擇器中，最后一個選擇器的權(quán)重是最大的，那么它所設(shè)置的各種樣式優(yōu)先級也是最高的,標(biāo)題的顏色也就被設(shè)置成了藍(lán)色。
需要注意的幾點：

不同優(yōu)先級，優(yōu)先級高的屬性有效
同優(yōu)先級，代碼順序在后面的屬性有效
行內(nèi)樣式優(yōu)先級最高，但在css樣式屬性后加上!important則該屬性優(yōu)先級最高
使用選擇器時，盡量不用!important和id，這樣的選擇器優(yōu)先級太高，會使代碼失去靈活性和通用性。也要少使用tag選擇器，這樣的選擇器則是優(yōu)先級太低，讓樣式表失去了減少代碼量，達(dá)到樣式復(fù)用的作用。
最后一點是，id唯一性是靠我們自己保證的。即使有多個相同的id，瀏覽器也能渲染出正確的結(jié)果。但我們要把id當(dāng)成元素的身份證，確保它的唯一性，減少代碼出莫名其妙的錯誤的概率。

批改老師：