第8章使用CSS樣式

《中文版DreamweaverCS5網(wǎng)頁(yè)制作實(shí)用教程》第八章使用CSS樣式學(xué)習(xí)目標(biāo)

CSS是英語(yǔ)CascadingStyleSheets（層疊樣式表單）的縮寫(xiě)，它是一種用于表現(xiàn)HTML或XML等文件式樣的計(jì)算機(jī)語(yǔ)言。用戶在設(shè)計(jì)與制作網(wǎng)頁(yè)的過(guò)程中，使用CSS樣式，可以有效地對(duì)頁(yè)面的布局、字體、顏色、背景和其他效果實(shí)現(xiàn)精確的控制。本章將主要介紹CSS樣式的相關(guān)知識(shí)，幫助用戶掌握利用CSS樣式創(chuàng)建精致網(wǎng)頁(yè)效果的具體方法。:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::本章重點(diǎn)

認(rèn)識(shí)CSS樣式

創(chuàng)建CSS樣式編輯CSS樣式:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.1CSS樣式的概念

CSS樣式是CascadingStyleSheets(層疊樣式單)的簡(jiǎn)稱，也可以稱為“級(jí)聯(lián)樣式表”，它是一種網(wǎng)頁(yè)制作的新技術(shù)，利用它可以對(duì)網(wǎng)頁(yè)中的文本進(jìn)行精確的格式化控制。

CSS樣式簡(jiǎn)介

CSS樣式規(guī)則:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.1.1CSS樣式簡(jiǎn)介

在CSS樣式之前，HTML樣式被廣泛應(yīng)用，HTML樣式用于控制單個(gè)文檔中某范圍內(nèi)文本的格式。而CSS樣式與之不同，它不僅可以控制單個(gè)文檔中的多個(gè)范圍內(nèi)文本的格式，而且可以控制多個(gè)文檔中文本的格式。:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.1.1CSS樣式規(guī)則

CSS樣式規(guī)則由兩部分組成：選擇器和聲明(大多數(shù)情況下為包含多個(gè)聲明的代碼塊)。選擇器是標(biāo)識(shí)已設(shè)置格式元素的術(shù)語(yǔ)，例如p、h1、類名稱或ID，而聲明塊則用于定義樣式屬性。例如下面CSS規(guī)則中，h1是選擇器，大括號(hào)({})之間的所有內(nèi)容都是聲明塊。

CSS樣式類型

CSS樣式應(yīng)用范圍:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.2使用CSS樣式

在Dreamweaver中，用戶可以創(chuàng)建一個(gè)CSS樣式，然后將其應(yīng)用到網(wǎng)頁(yè)文檔的單個(gè)或多個(gè)元素，完成文本的格式化。下面將主要介紹使用CSS樣式具體方法。:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.2.1認(rèn)識(shí)“CSS樣式”面板

用戶在Dreamweaver中選擇“窗口”|“CSS樣式”命令，可以打開(kāi)“CSS樣式”面板，該面板中顯示了當(dāng)前所選頁(yè)面元素的CSS規(guī)則和屬性，其頂部的有“全部”和“當(dāng)前”兩種模式按鈕，單擊相應(yīng)的按鈕，即可在兩種模式之間切換，并且可以在這兩種模式下進(jìn)行修改CSS屬性的操作。:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.2.2創(chuàng)建CSS樣式

在Dreamweaver中，用戶可以在“新建文檔”對(duì)話框中創(chuàng)建CSS樣式規(guī)則，也可以在“CSS樣式”面板中創(chuàng)建。:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.2.3應(yīng)用CSS樣式

新建CSS規(guī)則樣式后，就可以利用該樣式快速設(shè)置頁(yè)面上的網(wǎng)頁(yè)元素樣式，使網(wǎng)站具有統(tǒng)一的風(fēng)格。在Dreamweaver中，要對(duì)文檔指定元素應(yīng)用CSS樣式，用戶可以在“屬性”面板中設(shè)定或者在“標(biāo)簽檢查器”面板組的“屬性”面板中設(shè)定。下面將主要介紹在頁(yè)面中應(yīng)用CSS樣式的常用方法。通過(guò)“屬性”面板應(yīng)用CSS樣式

通過(guò)右鍵菜單應(yīng)用CSS樣式:::::《計(jì)算機(jī)基礎(chǔ)與實(shí)訓(xùn)教材系列》系列叢書(shū)官方網(wǎng)站/edu:::::8.3編輯CSS樣式對(duì)于創(chuàng)建的CSS樣式，可以進(jìn)行編輯操作，主要包括修改CSS樣式屬性、設(shè)置CSS樣式首選參數(shù)以及鏈接和導(dǎo)入CSS樣式