母版页上链接的 CSS 不适用于内容页上的控件答案

【问题标题】：CSS linked on master page not applying to controls on content page母版页上链接的 CSS 不适用于内容页上的控件
【发布时间】：2016-08-22 18:37:41
【问题描述】：

我正在尝试为网页制作警告横幅。我在面板内的 div 内使用标签，并在页面上声明了一些 css 样式。我不想在每个页面上声明这些样式，所以我将它们移到了我的 Site.css 文件（母版页使用）。当我这样做时，没有应用 css 样式的问题。母版页上的所有内容格式正确，但内容页中声明的控件格式不正确。

听听我在内容页面上的内容：

<asp:Content ID="Content2" ContentPlaceHolderID="ErrorMessages" runat="server">

<asp:Panel ID="WarningBanner" runat="server" CssClass="warningPanel" Visible="true">
    <div class="warningDiv">
        <asp:Label ID="testLabel" runat="server" Text="test" CssClass="warningLabel"></asp:Label>
    </div>
</asp:Panel>

<style>
.warningPanel {
    margin: auto;
    width: 1000px;
    background-color: red;
    border: 10px solid red;
}

.warningLabel {
    display: block;
    color: white;
    font-size: large;
}

.warningDiv {
    margin-left: auto; 
    margin-right: auto; 
    text-align: center;
}
</style>

</asp:Content>

听听我在母版页上的内容：

<head runat="server">
...ext...
    <link href="~/Content/Site.css" rel="stylesheet" /> 
...ext...
</head>
<body>
...ext...
    <div id="body">
        <asp:ContentPlaceHolder runat="server" ID="ErrorMessages" />
    <div/>
...ext...
<body/>

这就是我的 Site.css 文件的样子：

html {
    background-color: #e2e2e2;
    margin: 0;
    padding: 0;
}

.warningPanel {
    margin: auto;
    width: 1000px;
    background-color: red;
    border: 10px solid red;
}

.warningLabel {
    display: block;
    color: white;
    font-size: large;
}

.warningDiv {
    margin-left: auto; 
    margin-right: auto; 
    text-align: center;
}
...ext...

我做错了什么？

【问题讨论】：

尝试清除浏览器缓存，看看是否能解决您的问题。
@ConnorsFan 解决了我的问题！非常感谢！
按照你的建议，我添加了一个答案。

标签： css asp.net

【解决方案1】：

CSS 文件通常被浏览器缓存。发生这种情况时，对样式所做的更改将不会显示在 HTML 显示中。

您可以在更改 CSS 内容后清除浏览器缓存以查看修改后的样式。另一种方法是在链接中附加一个查询字符串，这也可以确保您的客户无需清除浏览器缓存即可看到更新后的 CSS：

<link href="~/Content/Site.css?version=2.5" rel="stylesheet" type="text/css" />

每次修改 CSS 文件时，您设置一个新的version 编号以强制下载更新的 CSS 文件。

【讨论】：

【解决方案2】：

您的代码没有问题。您可能没有为 CSS 文件指定正确的文件路径。仔细检查。另外，你有一个错字：

<div id="body">
    <asp:ContentPlaceHolder runat="server" ID="ErrorMessages" />
<div/>

应该是：

<div id="body">
    <asp:ContentPlaceHolder runat="server" ID="ErrorMessages" />
</div>

【讨论】：

我的文件路径是正确的。如果不是，则母版页上的任何 html 和 asp 控件都不会正确格式化。
我同意 Milan 的观点，代码看起来不错，除了几个关闭控件拼写错误 <body/> 和 <div/>。你是说 Site.css 中的一些样式正在应用，而不是警告面板、标签、div 样式？如果是这样，这似乎是一个缓存问题。