由于网站的主要频道页和列表页的头部和底部都是一样的，如果将每个页面放在单独的页面中，当头部和底部需要更改时维护量太大。于是想把头部和底部做成母版页，频道页和列表页的具体内容放到内容页中。这样当头和底需要改动时，只要修改一下母版页就可以了。

好处有了，问题也接着来了。原来在频道页和列表页中有其各自的css引入和一些javascript函数，当使用母版页时，放在内容页中这些css样式和 javascript函数怎么处理呢？因为大家知道，使用母版页的内容页是不能包含<head></head>标记的，而css 和javascript函数的声明是要放到<head></head>中间的，这些css样式和javascript函数如何处 理呢？上网查了一下，大致有三种解决方案：方案一：把所有的css样式和javascript函数放到母版页的<head></head>中， 我觉得这样做的弊端就是导致母版页的<head></head>区特别臃肿，同时如果原来两个频道页中包含同名的css声明或 javascript函数，但却是不同样式或执行不同操作，怎么办呢？所以这第一种方案很快被我否定了。方案二是在内容页的PageLoad事件中通过代 码来指定本内容页的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);
     }
}

这样，在具体页面，我们就可以通过如下代码添加 CSS 引用：

protected void Page_Load(object sender, EventArgs e)
{
     ControlHelper.AddStyleSheet(this.Page, "css/projectPage.css");    
}

这种解决方案的好处时可以在程序运行时动态更改所需的css文件，但是对javascript函数处理起来该怎么做呢？再说有必要把本该加在html代码中的css和javascript通过cs代码来加入吗？因此，这种解决方案也很快被我否定了。剩下的第三种解决方案就是在母版页的<head></head>中添加一个内容控件，然后在内容页中在对应的内容控件中写css和javascript代码。听起来这个这个解决方案应该是最方便，最适宜的解决方法。可是当我把ContentPlaceHolder控件拖放到<head></head中间时，vs2005却报了下面的错误：

白天的时候，看到这我就以为这种方法行不通了，差点就放弃了。晚上回家想找找更好的解决方案，可所有的文章基本上都是说的前两种，对第三种解决方案有人说报错，不行。看来碰到这个提示后放弃的人还真不少。我没理这个错误，直接转到内容页，，在内容页中插入以下代码：

 
看了一下，内容页中没有报错，看来有戏。可转到内容页的设计视图一看，出现了如下界面：

心凉了一下，因为没看到我上面应用的css样式的效果，我的css文件的代码如下：

#content
{
     text-align:center;
     width:200px;
     height:100px;
    
     color:#FF0000;
     font-size:12px;
}
也就是让id为content的div宽度200px，高度100px，文字居中，背景颜色为为绿色，字体为红色，12px。不甘心的我按下了F5调试键，令人惊喜的一个画面出现了：

这说明css应用成功了，同时也看到了那个测试可爱的hello world对话框alert了出来。成功了！

总结一下，其实很多人开始的想法和我一样，想如何用最简单的方法实现在内容页中使用css和 javascript的功能。他们中的很多人可能也找到我找到的那篇文章，但是当碰到我的那个母版页中的错误提示后就放弃了，也许有人坚持到了第二步，可 是在设计视图中没看到css的应用效果后可能也放弃了。其实只要在坚持一下就成功了！余世维说的好“比别人多想一点，你就能成功！”，确实很有道理啊

使用母版页时内容页如何使用css和javascript的更多相关文章

  1. 【转】asp使用母版页时内容页如何使用css和javascript

    源地址:https://www.cnblogs.com/accumulater/p/6767138.html

  2. 【转】使用母版页时内容页如何使用css和javascript

    源地址:https://www.cnblogs.com/accumulater/p/6767138.html

  3. CSS 使用母版页的内容页如何调用css和javascript

    方案一: 把所有的css样式和javascript函数放到母版页的<head></head>中,我觉得这样做的弊端就是导致母版页的<head></head&g ...

  4. asp.net C#母版页和内容页事件排版载入顺序生命周期

    asp.net C#母版页和内容页事件排版载入顺序生命周期 关于ASP页面Page_Load发生在事件之前而导致的问题已经喜闻乐见,对于问题的解释也非常全面.可是怎样解决这个问题则较少有人说明,我就再 ...

  5. asp.net C#母版页和内容页事件排版加载顺序生命周期

    asp.net C#母版页和内容页事件排版加载顺序生命周期 关于ASP页面Page_Load发生在事件之前而导致的问题已经喜闻乐见,对于问题的解释也很全面,但是如何解决问题则较少有人说明,我就再 简单 ...

  6. 引用母版页的内容页添加CSS文件

    在内容页当中定义一个类然后调用内中的方法即可 public static class addstyle{  //可以不用实例化 public static void addstylesheet(Pag ...

  7. ASP.NET母版页与内容页相对路径的问题

    1. 图片问题 图片显示问题:<img runat="server" src="~/images/ad468x60.gif" alt="&quo ...

  8. ASP.NET 母版页和内容页的加载顺序

    Master 模板页Content 内容页如果希望Master页面的数据传给Content页面,请Init如果希望Content页面的数据传给Master页面,请重载Load具体细节不多说了,看下面页 ...

  9. ASP.NET在母版页或内容页上获取控件ID

    原本想给一个button添加一个confirm,不同的分数提示不同的信息(大于80合格,小于80不合格,提示是否提交),最开始用了button.Atribute.Add();但是它每次获取到的是lab ...

随机推荐

  1. 004 html常用标签

    html常用标签 1.无语义标签 <div></div> <span></span> 2.常用语义标签 <hn></hn> 标题 ...

  2. MySQL binlog-server搭建

    MySQL binlog-server搭建 binlog在备份中起着至关重要的作用,备份binlog文件时,只能先在本地备份,然后才能传送到远程服务器上.从MySQL5.6版本后,可以利用mysqlb ...

  3. PHP获取文件后缀的7中方法

    在日常的工作当中我们避免不了要经常获取文件的后缀名,今天我就整理了一下7种获取文件后缀的方法,希望对大家有所帮助. $url = 'http://www.baidu.com/uploads/20185 ...

  4. 解析Java finally

    以下用几个简单的例子介绍一下finally的用法: 例子1 public class Test { public static void main(String[] args) { System.ou ...

  5. Linux三剑客之sed详解（2）

    一.sed 分组替换(),\1 实例:I am a oldboy teacher. 吧oldboy 提取出来 二.特殊符号&代表被替换的字符串 实例:批量替换文件名 把stu_102999_1 ...

  6. Python解答力扣网站题库简单版----第三讲

    1041. 困于环中的机器人 题库链接: 1041. 困于环中的机器人. 题干 在无限的平面上,机器人最初位于 (0, 0) 处,面朝北方.机器人可以接受下列三条指令之一: "G" ...

  7. STM32L0开发——ADC多通道采集，IDE和IAR开发注意事项

    keil开发L0系列是免费的,官方提供许可的.因此建议Keil开发,L011F3由于flash只有8K,因此不建议HAL库,建议使用cubemx+LL(或snippets库).0.起初,可以参考官方库 ...

  8. Google 超分辨率技术 RAISR

    每天都有数以百万计的图片在网络上被分享.储存,用户借此探索世界,研究感兴趣的话题,或者与朋友家人分享假期照片.问题是,大量的图片要嘛被照相设备的像素所限制,要嘛在手机.平板或网络限制下被人为压缩,降低 ...

  9. PAT Basic 1021

    1021 个位数统计 给定一个k位整数N = d~k-1~*10^k-1^ + ... + d~1~*10^1^ + d~0~ (0<=d~i~<=9, i=0,...,k-1, d~k- ...

  10. centos中python2替换为python3，并解决yum出错

    这里采用安装python3.6版本. 安装python3.6可能使用的依赖 yum install openssl-devel bzip2-devel expat-devel gdbm-devel r ...