css符號詳解

2021-08-25 12:32:32 字數 1955 閱讀 8558

一、型別選擇符

什麼是型別選擇符?指以網頁中已有的標籤型別作為名稱的行徑符。body是網頁中的乙個標籤型別,div,p,span都是。

如下:body {}

div {}

p {}

span {}

二、群組選擇符

對於xhmtl物件,可以對一組同時進行了相同的樣式指派。

使用逗號對選擇符進行了分隔,這樣書寫的優點在於同樣的樣式只需要書寫一次即可,減少**量,改善css**結構。

使用時應該注意"逗號"是在半形模式下,並非中文全形模式。

如下:h1,h2,h6,p,span

三、包含選擇符

對某物件中的子物件進行樣式指點定,這樣選擇方式就發揮了作用。

需要注意的是,僅對此物件的子物件標籤有效,對於其它單獨存在或位於此物件以外的子物件,不應用此樣式設定。

這樣做的優點在於,幫我們避免過多的id、class設定,直接對所需的元素進行定義。

如下:h2 span

如下:body h1 span strong

四、id選擇符

根據dom文件物件模型原理所出現的選擇符,對於乙個xhtml檔案,其中的每乙個標籤都可以使用乙個id=""的形式進行乙個名稱指派,但需要注意,在乙個xhtml檔案中id是具有唯一性而不可以重複的。

在div css布局的網頁中,可以針對不同的用途進行命名,如頭部為header、底部為footer。

xhtml如下:

< div id="content">< /div>

css如下:

#content

五、class選擇符

其實id是對於xhtml標籤的擴充套件,而class是對shtml多個標籤的一種組合,class直譯的意思是類或類別。

對於xhtml標籤使用class=""進行名稱指派。與id不同,class可以重複使用,對於多個樣式相同的元素,可以直接定義為乙個 class。

使用class的優點已不言自明,它對css**重用性有良好的體現,眾多的標籤均可以使用乙個樣式來定義而不需要每乙個編寫乙個樣式**。

xhtml如下:

< p class="he">< /p>

< span class="he">< /span>

< h5 class="he">< /h5>

css如下:

.he六、標籤指定式的選擇符

如果想同時使用id和class,也想同時使用標籤選擇符,可以使用如下的方式:

h1#content {}

/*表示所有id為content的h1標籤*/

例如:

其中所有h1標籤內的都執行h1#content {}

h1.p1 {}

/*表示所有class為p1的h1標籤*/

例如:< h1 class="p1">

其中所有h1標籤內的都執行h1.p1 {}

標籤指定式選擇符的精度介於標籤選擇符及id/class選擇符之間,是常用的選擇符之一。

七、組合選擇符

對於上面的所有選擇符而言,進行組合使用。如下:

h1 .p1 {}

/*表示h1下的所有class為p1的標籤*/

例如:< h1>

其中所有p1標籤內都執行h1 .p1 {}

#content h1 {}

/*表示id為content的標籤下的所有h1標籤*/

例如:

其中所有h1標籤內的都執行#content h1 {}

h1 .p1,#content h1 {}

/*表示h1下的所有class為p1的標籤以及id為content的標籤下的所有h1標籤*/

例如:< h1>

h1#content h2{}

/*id為content的h1標籤下的h2標籤*/

例如:

css選擇符是非常自由與靈活的,可以根據頁面的需要,使用各種選擇符,盡量結構化與優化css檔案.

CSS符號含義

1.css引用的基本形式 2.格式 a 在html檔案中引用css採用的形式 b 以 開頭可以應用到一般的元件中去,例如 testcss 則在div標籤中可以直接用 的形式 在元件中引用多個css樣式,在class屬性中用空格隔開 c 以 開頭應用到id與css樣式同名的元件中,例如 testcss...

CSS符號屬性

list style type none 不編號 list style type decimal 阿拉伯數字 list style type lower roman 小寫羅馬數字 list style type upper roman 大寫羅馬數字 list style type lower alp...

css符號含義

1.css引用的基本形式 2.格式 a 在html檔案中引用css採用的形式 b 以 開頭可以應用到一般的元件中去,例如 testcss 則在div標籤中可以直接用 的形式 在元件中引用多個css樣式,在class屬性中用空格隔開 c 以 開頭應用到id與css樣式同名的元件中,例如 testcss...