初學HTML CSS常用選擇器

2021-10-23 09:51:32 字數 1728 閱讀 1296

選擇器:瀏覽器通過選擇器為滿足條件的html元素新增css樣式

id選擇器:

瀏覽器為

id標籤屬性的屬性值與

id選擇器名相同的標籤元素新增

css樣式

,語法中使用的是"#"+對應的id值

類選擇器:

瀏覽器為

class標籤屬性的屬性值

類選擇器名相同的標籤元素新增

css樣式,語法中使用的是"."+對應的class值

what are you doing?

i am going to climb mountains

注意:

1.class

標籤屬性的屬性值不能以

數字開頭;

2.class

標籤屬性的屬性值可以有多個,每個值之間用

空格間隔

標籤選擇器:

瀏覽器為

html

文件內標籤名

標籤選擇器名相同的標籤元素新增

css樣式,語法中使用的是"標籤名"

後代選擇器:

後代選擇器(

descendant selector

)又稱為包含選擇器,用於為特定的

html

子元素新增

css樣式,語法結構:父級+子級定義的id值或class值或標籤值,父級與子級之間用空格間隔,使用子級時需遵循子級的語法。

hello

hi

分組選擇器:

如果html

文件多個

css樣式表內的部分樣式相同,則可以通過定義乙個分組選擇器以簡化

css樣式**, 該選擇器的選擇器名由多個選擇器組成,使用逗號分隔。

謙虛使人進步驕傲使人落後

萬用字元選擇器:

萬用字元選擇器匹配html文件中的任何html元素

/*取消標籤預設margin與padding值*/

加了上面的**之後的效果,取消標籤預設margin與padding值

HTML css樣式選擇器

style簡介 這篇介紹style,style有三種方式 1 在head中加style標籤,在標籤中寫css樣式 2 在body的標籤中新增style屬性,在屬性中增加css樣式 3 在link標籤中引入寫好的css樣式表 一 在head中新增style標籤 1 id選擇器 在乙個html頁面中,不...

HTML CSS 偽類選擇器

這個也有意思 之前幾天學的,現在寫寫剛好複習 偽類是什麼?偽類用於定義元素的特殊狀態,比如滑鼠懸浮在按鈕上,按鈕顏色會變就是乙個例子。鏈結偽類選擇器 修改鏈結狀態的選擇器 注意 a hover必須在 css 定義中的a link和a visited之後,才能生效!a active必須在 css 定義...

HTML CSS基礎(七) CSS選擇器

每一條css樣式宣告 定義 由兩部分組成,形式如下 選擇器 在 之前的部分就是 選擇器 選擇器 指明了 中的 樣式 的作用物件,也就是 樣式 作用於網頁中的哪些元素。標籤選擇器其實就是html 中的標籤。如 p 上面的css樣式 的作用 為p標籤設定12px字型大小,行間距設定1.6em的樣式。類選...