时间:2010-11-03 20:09:14

标签: asp.net master-pages stylesheet

我是来自PHP和ColdFusion背景的ASP.NET新手,我有一个非常简单的问题:

在我的母版页中,如何将我的一个CSS文件链接变为一个变量,所以当适当的页面(例如Home)出现时,它包含带有正确CSS文件的变量?

    <!-- Custom CSS Files -->
    <link href="<Page Specific CSS Variable>" rel="stylesheet" type="text/css" />
    <link href="../../Content/Styles/Site.css" rel="stylesheet" type="text/css" />
</head>

这会是答案吗? Home.aspx

<asp:Content ID="Content1" ContentPlaceHolderID="PageStylesheet" runat="server">
    <link href="../../Content/Styles/Home.css" rel="stylesheet" type="text/css" />
</asp:Content>

然后在Master Page:

<!-- Custom CSS Files -->
<asp:ContentPlaceHolder ID="PageStylesheet" runat="server" />

是吗?

3 个答案:

答案 0 :(得分:1)

一种解决方案是将属性添加到您可以从每个Web内容表单设置的母版页。例如:

MasterPage.Master

    <!-- Custom CSS Files --> 
    <link href="<%=this.PageSpecificCSSURL%>" rel="stylesheet" type="text/css" /> 
    <link href="../../Content/Styles/Site.css" rel="stylesheet" type="text/css" /> 
</head> 

MasterPage.Master.cs

private string mPageSpecificCSSURL = string.Empty;
public string PageSpecificCSSURL
{
    get
    {
        return mPageSpecificCSSURL;
    }
    set
    {
        mPageSpecificCSSURL = value;
    }
}

WebForm1.aspx.cs中

protected void Page_Load(object sender, EventArgs e)
{
    ((SiteMaster) this.Master).PageSpecificCSSURL = "mypage.css";
}

答案 1 :(得分:1)

在母版页的页眉中使用内容部分。这就是它的目的;用于CSS和/或脚本以及特定于内容页面的内容。内容将与母版页的内容合并,从而产生完整的头部。所有内容占位符都可以放在任何地方;标题,头,脚,无论你喜欢什么,你可以嵌套母版页。它们只是模板;你不必将自己局限于BODY内容。

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="REO.master.cs" Inherits="REO.REO" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>REO CMS</title>
    <link rel="Stylesheet" href="REO.css" type="text/css" />
    <script src="jquery-1.4.2.min.js" type="text/javascript"></script>
    <script src="jqueryui-1.8%20jquery-ui.min.js" type="text/javascript"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
    <asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
</head>


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AddCaseContact.aspx.cs" 
Inherits="REO.AddCaseContact" MasterPageFile="~/REO.Master" %>
<asp:Content ContentPlaceHolderID="head" runat="server">
    <script type="text/javascript">       
        function showMessage(wTitle, msg) {
            var $dialog = $('<div></div>')
                .html(msg)
                .dialog({
                    autoOpen: false,
                    title: wTitle,
                    modal: true,
                    height: 300,
                    buttons: { "Ok": function() { $(this).dialog("close"); } }
                });
        $dialog.dialog('open');
    }
</script>
</asp:Content>
<asp:Content ContentPlaceHolderID="MainContent" runat="server">

答案 2 :(得分:0)

在你的帮助下,答案在我的编辑范围内。完美。