动态加载内容页的css样式表

1. 第一种,使用HtmlLink加载

要动态加载内容中的样式表，先要将link设置成服务器控件，并通过在后台动态绑定link标签的href，从而实现动态加载内容页的样式表。
母版页：

//母版页中的href可写可不写，但要在link标签里面加上runat="server"，并设置link的id以便在后台在能调用
内容页：
HtmlLink css = Master.FindControl("css") as HtmlLink;
css.Href = stylesheet;
//其中stylesheet是该内容页的样式表的地址，是相对于根目录的地址。如根目录下的css文件夹里面的stylesheet.css，那么就要写上"css/stylesheet.css"。

2. 第二种,使用PlaceHolder加载


     
        System.Web.UI.Control a = (PlaceHolder)Page.FindControl("myplaceholder");
        System.Web.UI.HtmlControls.HtmlGenericControl objLink = new HtmlGenericControl("LINK");
        objLink.Attributes.Add("rel","stylesheet");
        objLink.Attributes.Add("type","text/css");
        objLink.Attributes.Add("href","StyleSheet1.css");
        objLink=objLink;
        a.Controls.Add(objLink);
    }
  myplaceholder这是placeholder控件是主要是起"占位符的做用"
。把这一句话 objLink.Attributes.Add("href","StyleSheet1.css");
改成objLink.Attributes.Add("href",dropdownlist1.SelectedValue);

3. 第三种
首先来说如何动态加载一个外部的CSS文件：(假设文件名为style.css)
最没有技术含量的方法：
document.write("");
@import(style.css)
这种方法只能用在外部CSS文件或style结点中，基本上不能算作是动态。在FF和IE中均可行。
使用document.createStyleSheet()方法
这个方法是IE only的，参数可以传递一个样式表中的值，如body{background: blue;}或者是一个外部CSS文件的URL，使用方法如document.createStyleSheet(style.css)，此URL的地址相对于当前页面。
动态创建link结点
function LoadCss(cssUrl) {
  var link = document.createElement("link");
  link.rel = "stylesheet";
  link.type = "text/css";
  link.href = "cssUrl";
  document.getElementsByTagName("body").item(0).appednChild(link);
}
这个方法在FF和IE中均可以使用，当然同样的思路还可以来创建style结点，然后使用XMLHttpRequest方法来加载cssURL中的内容，并把创建的style结点的innerHTML设置成XMLHttpRequest的responseText，但由于我认为这是最不经济、最不合理的一种方法，所以在这也就不讲了。
更新当前某个link结点
思路同上，但是这种作法是替换掉一个已有的link标签，可以用于更换网站的Theme，基本代码如下：
function ChangeTheme(cssUrl) {
  var theme = document.getElementByName("theme"); //假设存在id为theme的结点
  theme.href = cssUrl;
}
这种方法我测试过，在FF和IE中均可行。
动态创建样式元素
如果我想在网页上增加一个如下的CSS元素，应该怎么做呢？
.focus {
  color: red;
  font-style: bold;
}
当然，我可以创建一个style结点，然后把上面这段内容放到innerHTML中，那有没有别的办法呢？到目前为止，我还不知道除了上面那个方法以处一个在FF和IE中均可行的方法。不过在IE中我们可以这样做：
var sheet = document.createStyleSheet();
sheet.addRule(".focus", "color: red; font-style: bold;");

4.第四种,使用js实现

var css;
function include_css(css_file) {
  var html_doc = document.getElementsByTagName('head')[0];
  css = document.createElement('link');
  css.setAttribute('rel', 'stylesheet');
  css.setAttribute('type', 'text/css');
  css.setAttribute('href', css_file);
  html_doc.appendChild(css);


  css.onreadystatechange = function () {
    if (css.readyState == 'complete') {
        include_css("css/index.css")
    }
  }
  css.onload = function () {
      include_css("css/index.css")
  }
  return false;
}