CSS基本語法及其操作

2021-08-20 03:49:16 字數 2691 閱讀 8923

樣式表允許以多種方式規定樣式資訊。樣式可以規定在單個的 html 元素中,在 html 頁的頭元素中,或在乙個外部的 css 檔案中。甚至可以在同乙個 html 文件內部引用多個外部樣式表。

一般而言,所有的樣式會根據下面的規則層疊於乙個新的虛擬樣式表中,其中數字 4 擁有最高的優先權。

瀏覽器預設設定

外部樣式表

內部樣式表(位於

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

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

下面的兩個 id 選擇器,第乙個可以定義元素的顏色為紅色,第二個定義元素的顏色為綠色:

這個段落是紅色。

這個段落是綠色。

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

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

所有擁有 center 類的 html 元素均為居中。在下面的 html **中,h1 和 p 元素都有 center 類。這意味著兩者都將遵守 ".center" 選擇器中的規則。

注意:類名的第乙個字元不能使用數字!它無法在 mozilla 或 firefox 中起作用。

和 id 一樣,class 也可被用作派生選擇器:

.fancy td
在上面這個例子中,類名為 fancy 的更大的元素內部的**單元都會以灰色背景顯示橙色文字。(名為 fancy 的更大的元素可能是乙個**或者乙個 div)

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

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

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

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

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

屬性選擇器在為不帶有 class 或 id 的表單設定樣式時特別有用:

當讀到乙個樣式表時,瀏覽器會根據它來格式化 html 文件。插入樣式表的方法有三種:

當樣式需要應用於很多頁面時,外部樣式表將是理想的選擇。在使用外部樣式表的情況下,你可以通過改變乙個檔案來改變整個站點的外觀。每個頁面使用 標籤鏈結到樣式表。標籤在(文件的)頭部:

瀏覽器會從檔案 mystyle.css 中讀到樣式宣告,並根據它來格式文件。

外部樣式表可以在任何文字編輯器中進行編輯。檔案不能包含任何的 html 標籤。樣式表應該以 .css 副檔名進行儲存。下面是乙個樣式表檔案的例子:

hr 

p body

不要在屬性值與單位之間留有空格。假如你使用 「margin-left: 20 px」 而不是 「margin-left: 20px」 ,它僅在 ie 6 中有效,但是在 mozilla/firefox 或 netscape 中卻無法正常工作。

當單個文件需要特殊的樣式時,就應該使用內部樣式表。你可以使用 標籤在文件頭部定義內部樣式表,就像這樣:

由於要將表現和內容混雜在一起,內聯樣式會損失掉樣式表的許多優勢。請慎用這種方法,例如當樣式僅需要在乙個元素上應用一次時。

要使用內聯樣式,你需要在相關的標籤內使用樣式(style)屬性。style 屬性可以包含任何 css 屬性。本例展示如何改變段落的顏色和左外邊距:

this is a paragraph

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

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

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

h3
假如擁有內部樣式表的這個頁面同時與外部樣式表鏈結,那麼 h3 得到的樣式是:

color:red; 

text-align:right;

font-size:20pt;

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

css基本語法

最近 要經常用到css,但是語法 老是忘記,先貼起來!摘自http www.webjx.com 1.css的語法 css的定義是由三個部分構成 選擇符 selector 屬性 properties 和屬性的取值 value 語法 selector 選擇符 說明 選擇符是可以是多種形式,一般是你要定義...

CSS基本語法

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

CSS基本語法

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