1 CSS權重

1.1 權重規則

CSS匹配的選擇器中每一種選擇器類型的數組決定了選擇器的權重，CSS的優先級規則：

權重高的樣式會被應用到元素上。

如果權重相同則使用最后聲明的樣式。

屬性后加上!important，無條件優先

1.2 權重計算

內聯樣式的權重：1000
ID選擇器的權重：100
類選擇器、屬性選擇器、偽類選擇器的權重：10
元素選擇器的權重：1
通配符*、子選擇器>、兄弟選擇器+的權重：0

/* ul=1 + #nav=100 + li=1 + .active=10 + a=1 = 113*/ ul#nav li.active a { }

2 CSS的繼承

繼承是指子元素繼承父元素的樣式，下面列舉有繼承性的屬性：

2.1 字體屬性

font

font-family

font-weight

font-size

font-style

font-variant

2.2 文本屬性

text-indent：文本縮進

text-align：文本水平對齊

line-height：行高

word-spacing：字間距

letter-spacing：字符間距

text-transform：文本大小寫

direction：文本書寫方向

color：文本顏色

2.3 其他

元素可見性：visibility

表格布局屬性

列表布局屬性：ist-style-type、list-style-image、list-style-position、list-style

光標屬性：cursor：

頁面樣式屬性

3 CSS引入方式

內聯樣式

<p style="color:red">紅色的字</p>

內部樣式表

<style>p {color:red;} </style>

外部樣式表
鏈接式：<link type="text/css" rel="styleSheet" href="CSS文件路徑" />
導入式：<style type="text/css">@import url("css文件路徑"); </style> 鏈接式的語法是屬于HTML的，優先加載CSS文件到頁面
導入式的語法屬于CSS，先加載HTML結構再加載CSS文件

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的【HTML/CSS】CSS权重、继承及引入方式的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。