在早期的網(wǎng)站建設(shè)中，網(wǎng)頁完全由一些簡單排版的文字和圖片組成，HTML語言允許使用一些描述性的標(biāo)簽來美化網(wǎng)頁的設(shè)計(jì)。然而，隨著網(wǎng)絡(luò)技術(shù)的發(fā)展，簡單的HTML標(biāo)簽已經(jīng)不能滿足人們對(duì)網(wǎng)頁美觀的要求。因此，W3C制定了CSS的技術(shù)規(guī)范，希望能幫助網(wǎng)頁設(shè)計(jì)師通過CSS設(shè)計(jì)出各種精美的網(wǎng)頁。

CSS技術(shù)在網(wǎng)頁中主要用于布局和美化，與XHTML的有機(jī)結(jié)合可以使Web更加結(jié)構(gòu)化和規(guī)范化。 CSS作為最重要的網(wǎng)頁布局和美化工具之一，近年來得到了非常迅速的普及。國內(nèi)幾乎所有的大型商業(yè)網(wǎng)站都在使用CSS來進(jìn)行網(wǎng)頁布局，美化和設(shè)計(jì)網(wǎng)頁上的各種對(duì)象。

CSS（Cascading Style Sheet，層疊樣式表）是一種用于網(wǎng)頁設(shè)計(jì)的標(biāo)記語言，不需要編譯，直接被網(wǎng)頁瀏覽器解析。在網(wǎng)頁中，CSS的作用是在XHTML中描述和定義對(duì)象，并通過這些描述和定義來控制網(wǎng)頁中的對(duì)象和網(wǎng)頁的整體風(fēng)格。

Dreamweaver 具有強(qiáng)大的CSS 編輯功能。要在Dreamweaver 中編輯CSS，您需要使用CSS 面板。通過CSS面板，您可以為網(wǎng)頁添加、刪除和編輯CSS樣式代碼。

在Dreamweaver 中，執(zhí)行[window] | [CSS 樣式I 命令（或按Shift+F11 組合鍵），可以打開CSS 面板。該面板分為兩個(gè)部分，“所有規(guī)則”部分和“樣式屬性”部分。 All Rules 部分顯示了當(dāng)前網(wǎng)頁中的所有CSS 樣式，而Style Attributes 部分列出了當(dāng)前選中的CSS 樣式定義了哪些屬性，如圖4-1 所示。

在CSS面板中，可以通過一些按鈕來操作網(wǎng)頁的CSS規(guī)則，如表4-1所示。

使用Dreamweaver為網(wǎng)頁創(chuàng)建CSS規(guī)則，點(diǎn)擊【新建CSS規(guī)則】按鈕，在彈出的【新建CSS規(guī)則】對(duì)話框中設(shè)置新建CSS規(guī)則的基本參數(shù)，如圖4-2所示。

在此對(duì)話框中，可以創(chuàng)建不同類型的CSS 樣式。其中，對(duì)話框中詳細(xì)參數(shù)的介紹如表4-2所示。

如果您使用[新建CSS規(guī)則]對(duì)話框創(chuàng)建外部CSS樣式，Dreamweaver會(huì)提示您保存外部CSS鏈接文件。并在保存后自動(dòng)打開文件以供網(wǎng)頁設(shè)計(jì)師編輯。

CSS 是一個(gè)非常重要的網(wǎng)頁設(shè)計(jì)工具。目前幾乎所有的網(wǎng)頁設(shè)計(jì)都離不開CSS。因此，在設(shè)計(jì)網(wǎng)頁之前，有必要了解CSS的基本語法和結(jié)構(gòu)。

CSS的語句結(jié)構(gòu)非常簡單。每段CSS代碼由兩部分組成，即選擇器（Selector）

和聲明。聲明還包括屬性和屬性值兩部分，必須寫在大括號(hào)“{}”中。 Css代碼的書寫格式如下。

我們專注高端建站，小程序開發(fā)、軟件系統(tǒng)定制開發(fā)、BUG修復(fù)、物聯(lián)網(wǎng)開發(fā)、各類API接口對(duì)接開發(fā)等。十余年開發(fā)經(jīng)驗(yàn)，每一個(gè)項(xiàng)目承諾做到滿意為止，多一次對(duì)比，一定讓您多一份收獲！