【正文】 綠色；– 文本對(duì)齊：居中；– 字體：楷體， Times New Roman– 文字格式：加粗– 并在多個(gè)頁(yè)面元素中引用此類樣式。在上題中，若有一個(gè)網(wǎng)頁(yè)中的某個(gè)表格要采取不同的顯示方式：如– 顏色：藍(lán)色；– 字體：黑體 ,Arial Black– 其他與上題相同，應(yīng)在該頁(yè)上使用什么樣式表？27Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?練習(xí)：252。編輯一個(gè)外聯(lián)樣式表，它使所有網(wǎng)頁(yè)中表格的文本顯示為如下風(fēng)格：– 文字大?。?。若要在網(wǎng)頁(yè)上使用使用統(tǒng)一的頁(yè)面風(fēng)格：– 背景 為淺藍(lán)灰色（ cdcdfe），– 文本 為深藍(lán)色（ 000066），– 所有 網(wǎng)頁(yè)都不留邊 (Margin)，– 且 列表 項(xiàng)目、 表格 及 段落 文本中的字體均為 ； 顏色 ：綠色； 文本對(duì)齊 ：居中； 字體 ：楷體,Times New Roman； 文字格式 ：加粗。讓鼠標(biāo)移到不同對(duì)象上面，顯示不同形狀。OL OL { liststyletype: decimal } /* 1 2 3 4 5 etc. */ 252。Liststyleimage： 指定項(xiàng)目符號(hào)的圖形文件名稱，值為 url或 none { liststyletype: square } { liststyletype: none } 252。定義邊框：– Bordercolor– Borderwidth– Borderstyle22Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?分級(jí)屬性252。值為：left,right,center,justify21Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?區(qū)塊屬性252。值為 none,underline,overline,linethrough,blink.252。– Body{backgroundimage:url()}20Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?文本屬性252。Backgroundcolor： 指定背景顏色– H1{backgroundcolor:000800}252。– P{font: bold 16pt}19Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?顏色及背景屬性252。252。取值：normal（ 正常）、 oblique（ 偏斜體）、 italic（ 斜體）252。Fontfamily:指定文字的字體– H1{fontfamily:華文彩云 }252。– 鼠標(biāo)屬性 P130： 鼠標(biāo)形狀等。– 文本屬性： P128– 區(qū)塊屬性 P128： 邊框粗細(xì)等。樣式表的 5類常用屬性：詳見(jiàn) P126– 字體屬性 P126： 字體、字號(hào)、行距等。 textdecoration:underline被定義的樣式文本在此處。– 使用標(biāo)簽的 “Style”屬性來(lái)定義樣式。 /style/head例例 16Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?二、 CSS與 HTML文檔的結(jié)合方法252。外聯(lián)樣式： 使用 import導(dǎo)入 外部的樣式文件，凡在導(dǎo)入該樣式表的網(wǎng)頁(yè)都起作用– 定義外部樣式文件，用記事本或者Dreamweaver， 編輯完后文件擴(kuò)展名應(yīng)為 ”.css”；– 建立 HTML網(wǎng)頁(yè)文檔；– 在網(wǎng)頁(yè)文檔中 import導(dǎo)入 前面的樣式表。外聯(lián)樣式： 使用 link標(biāo)記符 鏈接到外部的樣式文件，凡鏈接的網(wǎng)頁(yè)都起作用– 定義外部樣式文件，用記事本或者Dreamweaver， 編輯完后文件擴(kuò)展名應(yīng)為 ”.css”；– 建立 HTML網(wǎng)頁(yè)文檔；– 在網(wǎng)頁(yè)文檔中使用 link標(biāo)簽將前面的樣式表文檔鏈接到網(wǎng)頁(yè)中。內(nèi)聯(lián)樣式：在 head標(biāo)記符內(nèi)定義，在本網(wǎng)頁(yè)內(nèi)起作用。HTML與樣式表有多種結(jié)合方法– 內(nèi)聯(lián)樣式 ：在 head標(biāo)記符內(nèi)定義– 外聯(lián)樣式?使用 link標(biāo)記符鏈接到外部的樣式文件?使用 CSS的 import標(biāo)記符來(lái)導(dǎo)入樣式文件– 在 HTML標(biāo)簽中直接加入樣式表的定義 。 fontstyle:italic}a:active {color: aaaaaa}:link {color: 000000}:visited {color: cccccc}:hover {color: 000000。u虛類和虛元素u在 html的頁(yè)面元素中沒(méi)有這種屬性，故稱其為虛類，僅在 。因此應(yīng)用時(shí)一般選取其中的一種。應(yīng)用的形式基本與類選擇符類似，定義時(shí)用 “”替代 ”.”。… }例例 兩種定義形式的區(qū)別？在標(biāo)簽中使用類選擇符樣式的使用方式如何？10Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?選擇符的類別252?！?}.classname{property1:value1。u語(yǔ)法如下：{property1:value1。u用戶定義的類選擇符u可以使用任何名稱命名類。HTML標(biāo)記符216。 property2:value2。選擇符216。 CSS文字的注釋形式與 C語(yǔ)言類似。 7Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?一、 CSS的基本概念252。color:red}b元素僅在 p元素作用范圍內(nèi)會(huì)套用上述的樣式設(shè)定。– 例如：p b{fontsize:12pt。fontsize:20px。但存在少數(shù)屬性不能繼承，見(jiàn) P119。fontfamily:黑體 。 CSS樣式的組合、繼承和關(guān)聯(lián)性u(píng)樣式的組合：把具有 相同聲明定義的選擇符 組合在一起，并用逗號(hào)隔開(kāi)。 color:red}size:large。 color:red}H2{ fontsize:large。 幾乎所有的 HTML標(biāo)記符形式都可以作為選擇符?！?}單一選擇符的復(fù)合樣式聲明應(yīng)該用 “。基本語(yǔ)法選擇符 {屬性 : 值 }選擇符 {屬性 1: 值 1。如 Dreamweaver、 Frontpage等超文本編輯器均可編輯樣式表；216。如 Dreamweaver、 Frontpage等都會(huì)自帶 CSS編輯器。六、 CSS的高級(jí)應(yīng)用2Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?一、 CSS的基本概念252。四、 CSS樣式的單位252。二、 CSS與 HTML文檔的結(jié)合方法252。第五章 樣式表 統(tǒng)一網(wǎng)站風(fēng)格、制作基本特效1Inter與網(wǎng)頁(yè)設(shè)計(jì)主要內(nèi)容252。一、樣式表 (CSS)的基本概念252。三、 CSS屬性的理解與應(yīng)用252。五、 CSS樣式在網(wǎng)頁(yè)中的應(yīng)用252。編寫(xiě) CSS樣式的方法?使用 CSS編輯器216。 ?使用超文本編輯器216。記事本3Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?一、 CSS的基本概念252。 屬性 2: 值 2 ?！备糸_(kāi)，為便于閱讀也可以 分行寫(xiě) 。 HEADTITLECSS例子 /TITLESTYLE TYPE=“text/css”H1{ fontsize:xlarge。 color:blue}/STYLE/HEADH1{ fontsize:xlarge。 }4Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?一、 CSS的基本概念252。－例如： 段落元素 p、 單元格元素 td和類 c1可以使用相同樣式：p,td,.c1{fontsize:12pt。color:red}5Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?一、 CSS的基本概念?樣式的繼承：若子元素未定義，則它將繼承上級(jí)元素的樣式的定義。HEADTITLECSS例子 /TITLEstyle!p{color:red。fontfamily:華文仿宋 , Comic Sans MS}b{textdecoration:underline}/style/HEAD 6Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?一、 CSS的基本概念?樣式表的 關(guān)聯(lián)性 ：– 樣式表的關(guān)聯(lián)性指在某些樣式定義中，可以定義某樣式僅 在某個(gè)特定元素范圍內(nèi) 才有效。fontfamily:黑體 。 而在其他地方不具有這些屬性。注釋216。p{fontsize:12pt} /*P標(biāo)簽的樣式定義 */8Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?一、 CSS的基本概念252。 樣式表的基本語(yǔ)法形式：selector{property1:value1?！瓆需要應(yīng)用的樣式的內(nèi)容樣式的屬性 樣式的屬性的值Select的五種合法的類別： HTML標(biāo)記符 、 用戶定義的類Class、 用戶定義的 ID、 虛類 和 虛元素 P1199Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?選擇符的類別252。應(yīng)用比較多，注意繼承性、組合性和關(guān)聯(lián)性（ P119） 的應(yīng)用。ubody里所有的元素都可以定義 “類 ”。 property2:value2。 property2:value2。ID選擇符216。216。見(jiàn) P120例子。u語(yǔ)法如下：頁(yè)面元素名：元素虛屬性名 {樣式表內(nèi)容 }11Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?a:link {color: 000000}a:visited {color: cccccc}a:hover {color: 000000。 fontstyle:italic}:active {color: aaaaaa}例例 12Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?二、 CSS與 HTML文檔的結(jié)合方法252。13Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?二、 CSS與 HTML文檔的結(jié)合方法252。headstyle type=text/css“ media=“screen”!body{ color:green }/style/head14Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?二、 CSS與 HTML文檔的結(jié)合方法252。headlink rel=“stylesheet” href=“” type=“text/css”/head例例 15Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?二、 CSS與 HTML文檔的結(jié)合方法252。headstyle! import url(“”)。在 HTML標(biāo)簽中直接加入樣式表的定義– 若在個(gè)別標(biāo)簽需要作樣式調(diào)整，可使用這種方式。p style=backgroundcolor:FFFF66。/p例例 17Inter與網(wǎng)頁(yè)設(shè)計(jì) CSS樣式表樣式表 ?三、 CSS屬性的理解