關於CSS樣式表
1.學習css之前應該掌握哪些基礎知識？
1.什麽是網頁，什麽是超文本語言(html)？
2.能夠使用Dreamweaver等常用編輯器。
Dreamweaver是目前最好的網站編輯工具之壹，Dreamweaver8增加的對CSS的支持讓妳使用CSS更加方便，所以用它來制作網頁的CSS樣式表會更加簡單方便。這個教程教妳如何使用Dreamweaver8來添加CSS到壹個頁面。妳可以輕松地在網頁中使用CSS，而不需要記住代碼標記或閱讀厚厚的CSS手冊。但是首先，妳應該對CSS有所了解。所以本教程前四章是CSS的理論知識，主要是對CSS的全面介紹。希望讀者看完之後對CSS的語法、結構、應用有壹個全面的了解。接下來的四章是DW實戰，主要是教大家如何使用Dreamweaver8在網頁中靈活運用CSS。在閱讀本文之前，您需要了解壹些關於HTML和使用Dreamweaver的知識。
2.理解CSS
CSS就是層疊樣式表，中文翻譯成“層疊樣式表”。這是制作網頁的新技術。
網頁設計最初使用HTML標簽來定義頁面文檔和格式，如標題
註意:CSS需要IE4(Internet Explorer 4.0)和NC4(Netscape 4.0)以上的瀏覽器支持，部分效果需要更高版本的瀏覽器支持。
3.如何使用CSS
如果妳使用的是Dreamweaver MX 2004或以上版本，在定義文本字體、顏色、大小等屬性時，看壹下代碼，妳會發現在頭部區域有這樣壹個部分:
& ltstyle type="text/css " >
& lt！-
. STYLE2 {
font-size:16pt；
字體系列:“快遞新”，快遞，等寬；
字體粗細:粗體；
顏色:# FF3300
}
-& gt；
& lt/style & gt；
那麽恭喜妳，妳已經用CSS設計網頁了。
那麽除了這種調用CSS的方法之外，還有別的方法嗎？答案是“當然”。下面是系統介紹。
在線方法:
如果只有壹個HTML標記需要樣式化，那麽可以向它添加屬性。
style= " "
單獨修改樣式。
頁面嵌入方法:
& ltstyle type="text/css " >& lt！-車身{背景:白色；顏色:黑色；}-& gt；& lt/style & gt；
外部呼叫方法:
& ltlink rel = " style sheet " rev = " style sheet " href = " CSS/style . CSS " type = " text/CSS " media = " all "/& gt；
& ltlink rel = " style sheet " rev = " style sheet " href = " CSS/style . CSS " type = " text/CSS " media = " all "/& gt；
調用樣式表的雙表方法:
& ltlink rel = " style sheet " rev = " style sheet " href = " CSS/style . CSS " type = " text/CSS " media = " all "/& gt；
& ltstyle type="text/css" media="all " >@導入URL(CSS/style 01 . CSS)；& lt/style & gt；
1.基礎語法
CSS的定義由三部分組成:選擇器、屬性和屬性值。
基本格式如下:
選擇器{屬性:值}
(選擇器{屬性:值})
選擇器可以有多種形式，通常是妳想要定義樣式的HTML標簽，比如BODY、p、table等。您可以通過此方法定義其屬性和值，屬性和值應該用冒號分隔:
身體{顏色:黑色}
選擇器主體是指頁面的主要部分，顏色是控制文本顏色的屬性，黑色是顏色的值。本示例的效果是使頁面中的文本變成黑色。
如果屬性的值由多個單詞組成，則必須在值上加上引號。例如，字體的名稱通常是幾個單詞的組合:
p {font-family: "sans serif"}
(將段落字體定義為無襯線字體)
如果您需要為壹個選擇器指定多個屬性，我們使用分號來分隔所有屬性和值:
p {text-align:居中；顏色:紅色}
(段落居中排列；並且段落中的文本是紅色的)
為了使您定義的樣式表易於閱讀，您可以使用逐行書寫格式:
p
{
文本對齊:居中；
顏色:黑色；
字體系列:arial
}
(段落居中排列，段落內文字為黑色，字體為arial)
2.選擇器組
您可以組合具有相同屬性和值的選擇器，並用逗號分隔選擇器，這樣可以減少樣式的重復定義:
h1，h2，h3，h4，h5，h6 {顏色:綠色}
(該組包括所有標題元素，每個標題元素的文本為綠色。)
p，table{ font-size: 9pt }
(段落和表格中的文字大小為9號)
其效果完全等同於:
p { font-size: 9pt }
表{ font-size: 9pt }
3.類別選擇器
使用類選擇器，可以將相同的元素分類為不同的樣式。定義類選擇器時，在自定義類的名稱前添加壹個點。如果您想要兩個不同的段落，壹個向右對齊，另壹個居中，您可以首先定義兩個類:
右{text-align: right}
中心{text-align: center}
然後不要在不同的段落中使用它，只需在HTML標簽中添加您定義的class參數:
& ltp class="right " >這壹段靠右對齊。
& lt/p & gt；
& ltp class="center " >
這壹段安排在中間。
& lt/p & gt；
& ltp class="right " >這壹段靠右對齊。
& lt/p & gt；
& ltp class="center " >
這壹段安排在中間。
& lt/p & gt；
註意:類名可以是任何英文單詞，也可以是英文單詞和數字的組合。壹般以其功能和作用簡單命名。
類選擇器的另壹個用途是省略選擇器中的HTML標記名，這樣可以將幾個不同的元素定義為相同的樣式:
。居中{text-align: center}
(定義的類選擇器。以文本為中心居中)
這樣的類可以應用於任何元素。讓我們將h1元素(heading 1)和P元素(paragraph)歸類為“center”，使得兩個元素的樣式都遵循類選擇器”。中心”:
& lth1 class="center " >
這個標題安排在中間。
& lt/h 1 & gt；
& ltp class="center " >
這壹段也安排在中間
& lt/p & gt；
註意:這種省略HTML標簽的類選擇器是最常用的CSS方法。使用這種方法，我們可以很容易地將預定義的類樣式應用於任何元素。
4.ID選擇器
在HTML頁面中，ID參數指定單個元素，ID選擇器用於為該單個元素定義單獨的樣式。
ID選擇器的應用類似於類選擇器，只要將類替換為ID即可。將上面示例中的類替換為ID:
& ltp id="intro " >
這壹段靠右對齊。
& lt/p & gt；
通過在ID名稱前添加“#”符號來定義ID選擇器。像類選擇器壹樣，有兩種方法來定義ID選擇器的屬性。在下面的示例中，ID屬性將匹配id="intro "的所有元素:
#簡介
{
font-size:110%；
字體粗細:粗體；
顏色:# 0000ff
背景色:透明
}
(字體大小為默認大小的110%；粗體；藍色；透明背景色)
在下面的示例中，ID屬性只匹配id="intro "的段落元素:
p #簡介
{
font-size:110%；
字體粗細:粗體；
顏色:# 0000ff
背景色:透明
}
註意:ID選擇器非常有限，只能獨立定義壹個元素的樣式，壹般只在特殊情況下使用。
5.包括選擇器
包含關系定義的樣式表可以單獨用於壹個元素，元素1包含元素2。此方法僅針對元素1中的元素2定義，對於單個元素1或元素2沒有定義，例如:
表a
{
font-size: 12px
}
表格中鏈接的樣式已經更改，文本大小為12像素，而表格外鏈接的文本仍然是默認大小。
6.級聯樣式表
層疊就是繼承，樣式表的繼承規則是外部元素樣式會被保留，並繼承到這個元素中包含的其他元素。事實上，嵌套在壹個元素中的所有元素都將繼承外部元素指定的屬性值，有時嵌套樣式的許多層會疊加在壹起，除非另有更改。例如，在DIV標簽中嵌套p標簽:
div {顏色:紅色；font-size:9pt}
……
& ltdiv & gt
& ltp & gt
這壹段文字是紅色9號。
& lt/p & gt；
& lt/div & gt；
(p元素中的內容將繼承DIV定義的屬性。)
註意:在某些情況下，內部選擇器不會繼承周圍選擇器的值，但理論上這些是特殊的。例如，上限屬性值將不會被繼承。直觀上，段落不會有與文檔正文相同的上限值。
此外，當樣式表繼承遇到沖突時，最後定義的樣式總是優先。如果p的顏色在上面的例子中定義:
div {顏色:紅色；font-size:9pt}
p {顏色:藍色}
……
& ltdiv & gt
& ltp & gt
這壹段文字是藍色9號。
& lt/p & gt；
& lt/div & gt；
我們可以看到段落中文本的大小是9，繼承了div屬性，而color屬性是根據最終的定義來定義的。
當不同的選擇器定義同壹個元素時，要考慮不同選擇器之間的優先級。ID選擇器、類選擇器和HTML標記選擇器具有最高的優先級，因為ID選擇器最後添加到元素中，然後是類選擇器。如果想超越三者的關系，可以用！重要提示提升樣式表的優先級，例如:
p { color: #FF0000！重要信息}
。藍色{ color: #0000FF}
#id1 { color: #FFFF00}
我們將這三種樣式同時添加到頁面中的壹個段落中，它最終會跟隨著！重要聲明的HTML標簽選擇器的樣式是紅色文本。如果妳拿掉它！重要的是，根據具有最高優先級的ID選擇黃色文本。
7.筆記
您可以在CSS中插入註釋來解釋代碼的含義。註釋有助於您或其他人在以後編輯和更改代碼時理解代碼的含義。在瀏覽器中，不顯示註釋。CSS註釋以“/*”開頭，以“*/”結尾，如下所示:
/*定義段落樣式表*/
p
{
文本對齊:居中；/*文本居中*/
顏色:黑色；/*文本為黑色*/
字體系列:arial /*字體為arial */
}
/*定義段落樣式表*/
p
{
文本對齊:居中；/*文本居中*/
顏色:黑色；/*文本為黑色*/
字體系列:arial /*字體為arial */
}
前面我們學習了CSS的語法，但是如果要在瀏覽器中展現效果，就必須讓瀏覽器識別並調用。瀏覽器讀取樣式表時，應該根據文本格式來讀取。以下是將樣式表插入頁面的四種方法:[u]鏈接外部樣式表[/u]，[u]內部樣式表[/u]，[u]導入外部樣式表[/u]和[u]嵌入樣式[/u]。
1.外部樣式表中的鏈接
外部樣式表中的鏈接是將樣式表保存為樣式表文件，然後使用
& lthead & gt
……
& ltlink href = " my style . CSS " rel = " style sheet " type = " text/CSS " media = " all " & gt；
……
& lt/head & gt；
上面的例子顯示了瀏覽器從mystyle.css文件中讀取文檔格式的已定義樣式表。Rel="stylesheet "意味著在頁面中使用這個外部樣式表。Type = "text/CSS "表示文件類型是樣式表文本。Href="mystyle.css "是文件的位置。媒體是選擇的媒體類型，包括:屏幕、紙張、語音合成設備、盲文閱讀設備等。
外部樣式表文件可以應用於多個頁面。當您更改此樣式表文件時，所有頁面的樣式都會相應地更改。在制作大量相同風格頁面的網站時非常有用，不僅減少了重復性的工作量，有助於以後的修改編輯，也減少了瀏覽時代碼的重復下載。
樣式表文件可以用任何文本編輯器(比如記事本)打開和編輯，壹般的樣式表文件擴展名是。css。內容是壹個定義好的樣式表，沒有HTML標簽。mystyle.css的內容如下:
hr {color: sienna}
p {左邊距:20px}
body { background-image:URL(" images/back 40 . gif ")}
/*將水平線的顏色定義為卡其色；段落左側的邊距為20像素；頁面的背景圖片是images目錄下的back40.gif文件*/
2.內部樣式表
內部樣式表是將樣式表放在頁面上
& lthead & gt
……
& ltstyle type="text/css " >