CSS 再學習，基礎篇

語法

共享宣告

h1,h2,h3,h4,h5,h6

繼承

通過 css 繼承，子元素將繼承最高端元素（在本例中是 body）所擁有的屬性（這些子元素諸如 p, td, ul, ol, ul, li, dl, dt,和 dd）。不需要另外的規則，所有 body 的子元素都應該顯示 verdana 字型，子元素的子元素也一樣。

如果你不希望 "verdana, sans-serif" 字型被所有的子元素繼承，又該怎麼做呢？比方說，你希望段落的字型是 times。沒問題。建立乙個針對 p 的特殊規則，這樣它就會擺脫父元素的規則。

body td, ul, ol, ul, li, dl, dt, dd

p

派生

strong h2 h2 strong

id選擇器

#red #green

id 選擇器和派生選擇器

#sidebar p

類選擇器

.center

class 也可被用作派生選擇器

.fancy td

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

元素也可以基於它們的類而被選擇：

td.fancy

那些以 fancy 標註的單元格都會是帶有灰色背景的橙色。那些沒有被分配名為 fancy 的類的單元格不會受這條規則的影響。

屬性選擇器

對帶有指定屬性的 html 元素設定樣式。

hello! hi!ello! hi!nihao!

只有中間是橫槓才有效。

選擇器描述

[attribute]

用於選取帶有指定屬性的元素。

[attribute=value]

用於選取帶有指定屬性和值的元素。

[attribute~=value]

用於選取屬性值中包含指定詞彙的元素。

[attribute|=value]

用於選取帶有以指定值開頭的屬性值的元素，該值必須是整個單詞。

[attribute^=value]

匹配屬性值以指定值開頭的每個元素。

[attribute$=value]

匹配屬性值以指定值結尾的每個元素。

[attribute*=value]

匹配屬性值中包含指定值的每個元素。

引入樣式表

引入（優）

內部（次之）

內聯（不建議）

this is a paragraph

如果某些屬性在不同的樣式表中被同樣的選擇器定義，那麼屬性值將從更具體的樣式表中被繼承過來。

例如，外部樣式表擁有針對 h3 選擇器的三個屬性：

h3

而內部樣式表擁有針對 h3 選擇器的兩個屬性：

h3

color: red; 
text-align: right; 
font-size: 20pt;

即顏色屬性將被繼承於外部樣式表，而文字排列（text-alignment）和字型尺寸（font-size）會被內部樣式表中的規則取代。

CSS 再學習，基礎篇

CSS學習總結基礎篇 CSS選擇器

css基礎語法篇

css基礎語法篇

CSS 再學習，基礎篇

CSS學習總結 基礎篇 CSS選擇器

css基礎 語法篇

css基礎 語法篇

相關推薦

CSS學習總結基礎篇 CSS選擇器

css基礎語法篇

css基礎語法篇