css 基礎語法

2021-09-07 21:38:11 字數 1860 閱讀 5857

元素選擇器

h1

id選擇器

#sidebar

類選擇器

.center

屬性選擇器

//

下面的例子為帶有 title 屬性的所有元素設定樣式:

[title]

//

下面的例子為 title="w3school" 的所有元素設定樣式:

[title=w3school]

//

包含指定值的 title 屬性的所有元素設定樣式。適用於由空格分隔的屬性值:

[title~=hello]

//

帶有包含指定值的 lang 屬性的所有元素設定樣式。適用於由連字元分隔的屬性值:

[lang|=en]

選擇器的分組

//

對選擇器進行分組,這樣,被分組的選擇器就可以分享相同的宣告。

h1,h2,h3,h4,h5,h6

選擇器的繼承

//

子元素從父元素繼承屬性。

body

派生選擇器

li strong

其他複雜寫法

//將同時有 href 和 title 屬性的 html 超連結的文字設定為紅色

a[href][title]

//後代選擇器

//只對 h1 元素中的 em 元素應用樣式

h1 em

//

子元素選擇器h1 > strong

//相鄰兄弟選擇器

h1 + p

p.important

.important.warning

注意區別:

td.fancy 

//在上面的例子中,類名為 fancy 的**單元將是帶有灰色背景的橙色。

.fancy td 

//類名為 fancy 的更大的元素內部的**單元都會以灰色背景顯示橙色文字。

偽類

a:link         /*

未訪問的鏈結

*/a:visited

/*已訪問的鏈結

*/a:hover

/*滑鼠移動到鏈結上

*/a:active

/*選定的鏈結

*/

屬性描述

css:active

向被啟用的元素新增樣式。

1:focus

向擁有鍵盤輸入焦點的元素新增樣式。

2:hover

當滑鼠懸浮在元素上方時,向元素新增樣式。

1:link

向未被訪問的鏈結新增樣式。

1:visited

向已被訪問的鏈結新增樣式。

1:first-child

向元素的第乙個子元素新增樣式。

2:lang

向帶有指定 lang 屬性的元素新增樣式。2

CSS語法基礎CSS語法基礎1 基本語法

css語法基礎css語法基礎1.基本語法 css的定義是由三個部分構成 選擇符 selector 屬性 properties 和屬性的取值 value 基本格式如下 selector 選擇符 選擇符是可以是多種形式,一般是你要定義樣式的html標記,例如body p table 你可以通過此方法定義...

CSS基礎語法

css 語法由三部分構成 選擇器 屬性和值 selector選擇器 selector 通常是你希望定義的 html 元素或標籤,屬性 property 是你希望改變的屬性,並且每個屬性都有乙個值。屬性和值被冒號分開,並由花括號包圍,這樣就組成了乙個完整的樣式宣告 declaration body上面...

CSS 基礎語法

css 規則由兩個主要的部分構成 選擇器,以及一條或多條宣告。selector選擇器通常是您需要改變樣式的 html 元素。每條宣告由乙個屬性和乙個值組成。屬性 property 是您希望設定的樣式屬性 style attribute 每個屬性有乙個值。屬性和值被冒號分開。selector下面這行 ...