CSS複習1 選擇器

2021-09-24 23:56:20 字數 1275 閱讀 5798

css 規則由兩個主要的部分構成:選擇器,以及一條或多條宣告。

每條宣告由乙個屬性和乙個值組成。

屬性(property)是您希望設定的樣式屬性(style attribute)。每個屬性有乙個值。屬性和值被冒號分開。

你可以對選擇器進行分組,這樣,被分組的選擇器就可以分享相同的宣告。用逗號將需要分組的選擇器分開。

h1,h2,h3,h4,h5,h6
根據 css,子元素從父元素繼承屬性。但是它並不總是按此方式工作。看看下面這條規則:

body
根據上面這條規則,站點的 body 元素將使用 verdana 字型(假如訪問者的系統中存在該字型的話)。

通過 css 繼承,子元素將繼承最高端元素(在本例中是 body)所擁有的屬性(這些子元素諸如 p, td, ul, ol, ul, li, dl, dt,和 dd)。不需要另外的規則,所有 body 的子元素都應該顯示 verdana 字型,子元素的子元素也一樣。並且在大部分的現代瀏覽器中,也確實是這樣的。

id 選擇器可以為標有特定 id 的 html 元素指定特定的樣式。

id 選擇器以 "#" 來定義。

注意:id 屬性只能在每個 html 文件**現一次

在 css 中,類選擇器以乙個點號顯示:

可以為擁有指定屬性的 html 元素設定樣式,而不僅限於 class 和 id 屬性。

注釋:只有在規定了 !doctype 時,ie7 和 ie8 才支援屬性選擇器。在 ie6 及更低的版本中,不支援屬性選擇。

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

[title]

選擇器

描述[attribute]

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

[attribute=value]

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

[attribute~=value]

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

[attribute|=value]

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

[attribute^=value]

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

[attribute$=value]

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

[attribute*=value]

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

CSS選擇器複習

通用選擇器 選擇到所有的元素 選擇子元素 選擇到元素的直接後代 第一級子元素 相鄰兄弟選擇器 選擇到緊隨目標元素後的第乙個元素 普通兄弟選擇器 選擇到緊隨其後的所有兄弟元素 偽類選擇器 before,after在元素內容前面 後面新增內容 相當於行內元素 css3結構選擇器 nth child 選擇...

CSS3 選擇器 屬性選擇器(複習)

e attr 只使用屬性名,但沒有確定任何屬性值 demo a id demo a href title e attr value 指定屬性名,並指定了該屬性的屬性值 demo a id first demo a href title 對於e attr value 這種屬性值選擇器有一點需要注意 屬...

前端 css選擇器的複習

doctype html html lang en head meta charset utf 8 title 三種匯入css的方式 title style body style link rel stylesheet href 選擇器的複習.css head body p style color ...