Day3 CSS 引入及基本選擇器

2021-09-21 02:42:11 字數 1285 閱讀 3134

層疊樣式表,為了使網頁元素的樣式更加豐富,內容與樣式拆分開來。

html負責結構與內容,表現形式交給css。

css注釋

/**/ 來注釋

css的語法結構

選擇器選擇器:將樣式與頁面元素關聯起來的名稱。

css 引用

1 外鏈式

通過link標籤,鏈結到相應的css檔案,寫在head標籤中

day3.css 內容如下:

div
2 嵌入式

嵌入式是通過 style標籤來寫css ,也要寫在head標籤中。

3 內鏈式

內鏈式,同樣使用style屬性來設定css樣式

在css的三種使用方式中存在優先順序的問題,頁面從上到下載入,離元素越近相應的優先順序越高。

1標籤選擇器

標籤選擇器,通過標籤來設定元素樣式 影響範圍最大。

2 類選擇器

類選擇器,通過class類名來設定元素的樣式,class是可以重名的,影響範圍可控制相對較小,

乙個類可應用於多個選擇器,乙個元素可以使用多個類。

3 id選擇器

通過id選擇元素,元素的id的值不可以重複

#id選擇器,通過id屬性值來設定元素的樣式,影響範圍最小

id在html中具有唯一性,不能重名,js中獲取會有問題

三種選擇器的優先順序

影響範圍越大優先順序越小,即:

id>class>元素選擇器

推薦使用class選擇器

4層級選擇器

通過父級元素來設定子集元素,設定子元素的子集樣式

還可以設定子元素的自己的樣式,可以與多個選擇器混合使用

5組選擇器,並列選擇器

要求以下元素的寬度與高度均為200px,box1的背景色為紅,box2為綠色,box3為藍色

6偽類,偽元素選擇器

love

css3 基本選擇器

css3 之前的基本選擇器 萬用字元選擇器 元素選擇器 類選擇器 id選擇器 後代選擇器。css3 新增基本選擇器 子元素選擇器 相鄰兄弟元素選擇器 通用兄弟選擇器 群組選擇器 子元素選擇器 只能選擇某元素的子元素 不包含所有後代,至選擇下一代 父元素 子元素 相鄰兄弟元素選擇器 可以選擇在乙個元素...

css3 基本選擇器之標籤選擇器

三種方式的展示 傳說,在太古神農大神誕生時,天下伴有九泉相生。這九座神泉又稱神農 為天地九井,乃是滋生萬物的源泉。九泉中凝聚了世上最濃厚的靈力,為天地靈脈之樞紐。九泉伴神農而生,後又經神農千萬年辛勞疏通,逐漸成為天地間最重要的生命源泉。九泉面前,眾生平等。無論是神駿奇麗的靈獸仙禽,還是醜陋不堪的兇獸...

css3 選擇器 CSS3選擇器

子級選擇器用於選取帶有特定父元素的元素。書寫語法 element1 element2 注意 如果 element2 元素不是父元素 element1 的直接子元素,則不會被選擇。符號之前書寫父級的選擇器,符號之後寫子級選擇器,必須滿足父子級關係才選中標籤 相鄰兄弟選擇器可以用於選擇緊接在另乙個元素後...