《樣式、主題和母版頁(yè).ppt》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫(kù)。

1、第10章樣式、主題和母版頁(yè)本章重點(diǎn)主題的創(chuàng)建樣式的屬性母版頁(yè)和內(nèi)容頁(yè)10.1主題10.1.1概述主題機(jī)制使得開(kāi)發(fā)人員可以很輕松地對(duì)頁(yè)面的設(shè)置實(shí)現(xiàn)更多的選擇。它在處理主題的設(shè)置時(shí)提供了清晰的目錄結(jié)構(gòu)，資源文件的層級(jí)關(guān)系非常清晰。在易于查找和管理的同時(shí)，提供了良好的擴(kuò)展性。因此使用主題可以提高設(shè)計(jì)和維護(hù)網(wǎng)站的效率。主題是有關(guān)頁(yè)面和控件的外觀屬性設(shè)置的集合，由一組元素組成，包括外觀文件、級(jí)聯(lián)樣式表（CSS）、圖像和其他資源。10.1主題10.1.1概述主題至少包含外觀文件（.skin文件），主題是在網(wǎng)站或We

2、b服務(wù)器上的特殊目錄中定義的，一般把這個(gè)特殊目錄稱(chēng)為專(zhuān)用目錄，這個(gè)專(zhuān)用目錄的名字為App_Themes。App_Themes目錄下可以包含多個(gè)主題目錄，主題目錄的命名由程序員自己決定。而外觀文件等資源則是放在主題目錄下的。10.1主題10.1.1概述主題的組成元素：1.外觀文件外觀文件又稱(chēng)皮膚文件，是具有文件擴(kuò)展名.skin的文件，在皮膚文件里，可以定義控件的外觀屬性。外觀文件形式一般具有下面形式：上面

3、定義了Label控件的一個(gè)皮膚，可以在網(wǎng)頁(yè)引用該皮膚去設(shè)置Label控件的外觀。10.1主題10.1.1概述2.級(jí)聯(lián)樣式表級(jí)聯(lián)樣式表就是CSS文件，是具有文件擴(kuò)展名.css的文件，也是用來(lái)存放定義控件外觀屬性的代碼的文件。3.圖像和其他資源圖像就是圖形文件，其他資源可能是聲音文件、腳本文件等。有時(shí)候?yàn)榱丝丶烙^，只是靠顏色、大小和輪廓來(lái)定義并不能滿足要求，這時(shí)候就會(huì)考慮把一些圖片、聲音等加到控件外觀屬性定義中去。10.1主題10.1.2主題的創(chuàng)建1.右鍵單擊要為之創(chuàng)建主題的網(wǎng)站項(xiàng)目，在彈出的菜單中選擇“

4、添加ASP.NET文件夾”

5、“主題”命令。此時(shí)就會(huì)在該網(wǎng)站項(xiàng)目下添加一個(gè)名為App_Themes文件夾，并在該文件夾中自動(dòng)添加一個(gè)默認(rèn)名為T(mén)hemes1的文件夾。10.1主題10.1.2主題的創(chuàng)建2.右鍵單擊Themes1文件夾，在彈出的菜單里選擇“添加新項(xiàng)…”命令，此時(shí)會(huì)彈出“添加新項(xiàng)”對(duì)話框，該對(duì)話框提供了在Themes1文件夾里可以添加的文件的模板。10.1主題10.1.2主題的創(chuàng)建3.在“添加新項(xiàng)”對(duì)話框里選擇“外觀文件”，在“名稱(chēng)”文本框里會(huì)出現(xiàn)該文件默認(rèn)命名Skin1.skin，單擊“添加”

6、按鈕，Skin1.skin就會(huì)添加在Themes1目錄下。10.1主題10.1.3主題的應(yīng)用在網(wǎng)頁(yè)中使用某個(gè)主題都會(huì)在網(wǎng)頁(yè)定義中加上“Theme=[主題目錄](méi)”的屬性，示例代碼如下：<%@PageTheme=”Themes1”…%>為了將主題應(yīng)用于整個(gè)項(xiàng)目，可以項(xiàng)目的根目錄下的Web.config文件里進(jìn)行配置，示例代碼如下：上面通

7、過(guò)把屬性Themes設(shè)置為T(mén)hemes1來(lái)把該主題應(yīng)用于整個(gè)項(xiàng)目。10.1主題10.1.4SkinID的應(yīng)用SkinID是ASP.NET為Web控件提供的一個(gè)聯(lián)系到皮膚的屬性，用來(lái)標(biāo)識(shí)控件使用哪種皮膚。有時(shí)需要同時(shí)為一種控件定義不同的顯示風(fēng)格，這時(shí)可以在皮膚文件中定義SkinID屬性來(lái)區(qū)別不同的顯示風(fēng)格，例如，在LabelSkinFile.skin文件中對(duì)Label控件定義了三種顯示風(fēng)格的皮膚，代碼如下：

8、el>10.1主題10.1.5主題的禁用主題將重寫(xiě)頁(yè)和控件外觀的本地設(shè)置，而當(dāng)控件或頁(yè)已經(jīng)有預(yù)定義的外觀，且又不希望主題重寫(xiě)它時(shí)，就可以利用禁用方法來(lái)忽略主題的作用。禁用頁(yè)的主題通過(guò)設(shè)置@Page指令的EnableTheming屬性為

9、false來(lái)實(shí)現(xiàn)，例如：<%@PageEnableTheming=”false”%>禁用控件的主題通過(guò)將控件的EnableTheming屬性設(shè)置為false來(lái)實(shí)現(xiàn)，例如：10.2樣式CSS是CascadingStytleSheet的簡(jiǎn)稱(chēng)，簡(jiǎn)稱(chēng)樣式表。它是一種用戶增強(qiáng)控制頁(yè)面樣式并允許將樣式信息與頁(yè)面內(nèi)容分離的標(biāo)記性