- 相關(guān)推薦
母版頁(yè)時(shí)內容頁(yè)是如何使用css和javascript
好處有了，問(wèn)題也接著(zhù)來(lái)了。原來(lái)在頻道頁(yè)和列表頁(yè)中有其各自的css引入和一些javascript函數，當使用母版頁(yè)時(shí)，放在內容頁(yè)中這些css樣式和javascript函數怎么處理呢？因為大家知道，使用母版頁(yè)的內容頁(yè)是不能包含標記的，而css和javascript函數的聲明是要放到中間的，這些css樣式和javascript函數如何處理呢？上網(wǎng)查了一下，大致有三種解決方案：方案一：把所有的css樣式和javascript函數放到母版頁(yè)的中，我覺(jué)得這樣做的弊端就是導致母版頁(yè)的區特別臃腫，同時(shí)如果原來(lái)兩個(gè)頻道頁(yè)中包含同名的css聲明或javascript函數，但卻是不同樣式或執行不同操作，怎么辦呢？所以這第一種方案很快被我否定了。方案二是在內容頁(yè)的PageLoad事件中通過(guò)代碼來(lái)指定本內容頁(yè)的css文件。具體代碼如下：
復制代碼 代碼如下:
static public class ControlHelper
{
static public void AddStyleSheet(Page page, string cssPath)
{
HtmlLink link = new HtmlLink();
link.Href = cssPath;
link.Attributes["rel"] = "stylesheet";
link.Attributes["type"] = "text/css";
page.Header.Controls.Add(link);
}
}
這樣，在具體頁(yè)面，我們就可以通過(guò)如下代碼添加 CSS 引用：
復制代碼 代碼如下:
protected void Page_Load(object sender, EventArgs e)
{
ControlHelper.AddStyleSheet(this.Page, "css/projectPage.css");
}
這種解決方案的好處時(shí)可以在程序運行時(shí)動(dòng)態(tài)更改所需的css文件，但是對javascript函數處理起來(lái)該怎么做呢？再說(shuō)有必要把本該加在html代碼中的css和javascript通過(guò)cs代碼來(lái)加入嗎？因此，這種解決方案也很快被我否定了。剩下的第三種解決方案就是在母版頁(yè)的中添加一個(gè)內容控件，然后在內容頁(yè)中在對應的內容控件中寫(xiě)css和javascript代碼。聽(tīng)起來(lái)這個(gè)這個(gè)解決方案應該是最方便，最適宜的解決方法�？墒钱斘野袰ontentPlaceHolder控件拖放到
白天的時(shí)候，看到這我就以為這種方法行不通了，差點(diǎn)就放棄了。晚上回家想找找更好的解決方案，可所有的文章基本上都是說(shuō)的前兩種，對第三種解決方案有人說(shuō)報錯，不行�？磥�(lái)碰到這個(gè)提示后放棄的人還真不少。我沒(méi)理這個(gè)錯誤，直接轉到內容頁(yè)，，在內容頁(yè)中插入以下代碼：
看了一下，內容頁(yè)中沒(méi)有報錯，看來(lái)有戲�？赊D到內容頁(yè)的設計視圖一看，出現了如下界面：
心涼了一下，因為沒(méi)看到我上面應用的css樣式的效果，我的css文件的代碼如下：
復制代碼 代碼如下:
#content
{
text-align:center;
width:200px;
height:100px;
background-color:#00FF00;
color:#FF0000;
font-size:12px;
}
也就是讓id為content的div寬度200px，高度100px，文字居中，背景顏色為為綠色，字體為紅色，12px。不甘心的我按下了F5調試鍵，令人驚喜的一個(gè)畫(huà)面出現了：
這說(shuō)明css應用成功了，同時(shí)也看到了那個(gè)測試可愛(ài)的hello world對話(huà)框alert了出來(lái)。成功了！
總結一下，其實(shí)很多人開(kāi)始的想法和我一樣，想如何用最簡(jiǎn)單的方法實(shí)現在內容頁(yè)中使用css和javascript的功能。他們中的很多人可能也找到我找到的那篇文章，但是當碰到我的那個(gè)母版頁(yè)中的錯誤提示后就放棄了，也許有人堅持到了第二步，可是在設計視圖中沒(méi)看到css的應用效果后可能也放棄了。其實(shí)只要在堅持一下就成功了！余世維說(shuō)的好“比別人多想一點(diǎn)，你就能成功！”，確實(shí)很有道理啊。
【母版頁(yè)時(shí)內容頁(yè)是如何使用css和javascript】相關(guān)文章：
word如何設置頁(yè)邊距11-01
word如何刪除空白頁(yè)09-26
網(wǎng)站優(yōu)化如何做404頁(yè)面?08-07
如何刪除網(wǎng)站中過(guò)多的404頁(yè)面?08-18
淘寶無(wú)線(xiàn)端高轉化詳情頁(yè)如何制作06-20
唱歌時(shí)如何使用話(huà)筒08-18
唱歌時(shí)如何使用話(huà)筒?12-17
Javascript中arguments對象的詳解和使用方法08-20
ppt頁(yè)邊距怎么設置07-16