中断CSS样式表档连结课件.ppt

1、1第第10章章 CSS 樣式設定樣式設定10-1CSS 樣式與網頁的結合樣式與網頁的結合10-2建立全新的建立全新的CSS 樣式樣式10-3編修編修CSS 樣式內容樣式內容10-4外部樣式表的設定與連結外部樣式表的設定與連結10-5CSS 樣式使用技巧樣式使用技巧210-1CSS 樣式與網頁的結合樣式與網頁的結合局部套用局部套用CSS 樣式樣式這種方式只是加強網頁中的某些標題或某些段落，它會在標籤中加入“style=屬性:設定值”的語法。雖然有較多的樣式變化，但是不易於網站的管理，因此對於網站的管理，網頁設計師通常較少採用此種方式。內嵌於網頁文件開頭內嵌於網頁文件開頭這種方式是將CSS 語法放

2、置在 與 標籤之間，以設定整個網頁的樣式。（如10-2 節所介紹的內容屬之）3使用外部連結的使用外部連結的CSS 檔檔當網站的內容較龐大時，為了有效管理網站，可以考慮將文字內容與排版分開處理；也就是說，HTML 標籤只負責文章內容，CSS 專門控制版面編排，而最後將CSS 所定義的樣式，以連結的方式和其他的HTML 網頁結合在一起。45類別（可套用至任何HTML 元素）對於可能會經常使用的樣式，可以選用這種選取器類別，這樣容易讓網站具有一致性。ID（僅套用至一個HTML 元素）想要讓網頁元素具有與眾不同的樣式，就可以選用此種方式。標籤（重新定義HTML 元素）對於HTML 標籤語法，諸如：圖片

3、、標題、段落文字.等，想要重新定義它的樣式，可以選用此類別。複合（依您的選項而定）複合（依您的選項而定）選用此項可將樣式套用到特定元素之中。610-2建立全新的建立全新的CSS 樣式樣式重新定義HTML 元素789101112建立類別樣式建立類別樣式1314151610-3編修編修CSS 樣式內容樣式內容從屬性面板編修CSS 樣式171819從從CSS 樣式面板編修樣式面板編修CSS 樣式樣式20212210-4外部樣式表的設定與連結外部樣式表的設定與連結23建立外部樣式表建立外部樣式表24252627儲存外部樣式表檔儲存外部樣式表檔28連結已建立的外部樣式表連結已建立的外部樣式表2930設計

4、階段樣式表設計階段樣式表31323334中斷中斷CSS 樣式表檔連結樣式表檔連結已做連結的樣式表若要與編輯的網頁中斷，可按CSS 樣式面板下的 鈕，就可以中斷連結。如圖示：3510-5CSS 樣式使用技巧樣式使用技巧由頁面屬性設定CSS 樣式(1)範例檔：1010_ 頁面屬性.htmlCSS 外觀設定36由頁面屬性設定由頁面屬性設定CSS 樣式樣式(2)CSS 連結設定37由頁面屬性設定由頁面屬性設定CSS 樣式樣式(3)CSS 標題設定38以以CSS 設定水平分隔線設定水平分隔線39404142以以CSS 設定項目清單樣式設定項目清單樣式43444546以以CSS 設定圖片特效設定圖片特效47484950本章結束本章結束Q&AQ&A討論時間討論時間