日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

css html5360百科,div+css

發布時間:2023/12/10 编程问答 42 豆豆
生活随笔 收集整理的這篇文章主要介紹了 css html5360百科,div+css 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

所謂CSS優先級,即是指CSS樣式在瀏覽器中被解析的先后順序。

內聯樣式(inline style) > ID選擇符 > 類選擇符(class), 偽類(pseudo-class)和屬*(attribute)選擇符 > 類別(type),偽對象(pseudo-element)

一,解釋:

*內聯樣式(inline style):元素的style屬*,比如

*ID選擇符:元素的id屬*,比如

*類選擇符:比如

*偽類(pseudo-class):最常見的是錨(a)偽類,比如a:link,a:visited.

*屬性選擇符(attribute selectors):比如div[class=demo],含有class為demo的div元素

*類別選擇器(type selector):HTML標簽選擇,比如div .demo,div元素下含有class為demo的元素

*偽對象選擇器(pseudo-element selector):比如div:first-letter,div元素下的第一個單詞。

多重CSS樣式定義,屬性追加重復最后優先原則

一個標簽可以同時定義多個class,也可以是同一個class中重復定義屬性。例如:

我們先定義兩個樣式

.one{width:200px;background:url(images/imgA.jpg) no-repeat left top;}

.two{border:10px solid #000; background:url(images/imgB.jpg) no-repeat left top;}

在頁面代碼中,我們可以這樣調用:

這樣最終的顯示效果是這個div樣式是什么呢??重復的是以哪一個為準呢??

width:200px;

border:10px solid #000;

background:url(images/imgB.jpg) no-repeat left top;

因為,當應用兩個或多個樣式時,瀏覽器所應用的樣式根據是屬性追加重復最后優先原則

就是說兩個或多個或重復的樣式名定義,瀏覽器所應用的樣式是按先后順序的,如果定義了重復的屬性值,以最后定義的為準,如果應用了兩個或多個樣式名,里面不重復定義的

屬性值就追加上去,重復的屬性值就以最后一個為準。這里要注意的是,樣式的先后不是根據頁面上應用的名字順序,而是樣式表里的樣式順序。

二、CSS的調用

頁面內嵌法:就是將樣式表直接寫在頁面代碼的head區。類似這樣:

外部調用法:將樣式表寫在一個獨立的.css文件中,然后在頁面head區用類似以下代碼調用。

"@import"命令方法:類以下代碼,

本人推薦使用第二種調用方法(外部調用法)

優先規則

既然樣式有優先級,那么就會有一個規則來約定這個優先級,而這個"規則"就是本次所需要講的重點。

樣式表中的特殊性描述了不同規則的相對權重,它的基本規則是:

1、統計選擇符中的ID屬性個數。

2、統計選擇符中的CLASS屬性個數。

3、統計選擇符中的HTML標記名個數。

最后,按正確的順序寫出三個數字,不要加空格或逗號,得到一個三位數(css2.1是用4位數表示)。( 注意,你需要把數字轉換成一個以三個數字結尾的更大的數)。相應于選擇符的最終數字列表可以很容易確定較高數字特性凌駕于較低數字的。

例如:

1、每個ID選擇符(#someid),加 0,1,0,0。

2、每個class選擇符(.someclass)、每個屬性選擇符(形如[attr=value]等)、每個偽類(形如:hover等)加0,0,1,0。

3、每個元素或偽元素(:firstchild)等,加0,0,0,1。

4、其它選擇符包括全局選擇符*,加0,0,0,0。相當于沒加,不過這也是一種specificity,后面會解釋。

總結

以上是生活随笔為你收集整理的css html5360百科,div+css的全部內容,希望文章能夠幫你解決所遇到的問題。

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