ASP.Net，母版页：每页样式表
Posted
技术标签:
【中文标题】ASP.Net，母版页：每页样式表【英文标题】：ASP.Net, Master Pages : style-sheet per page 【发布时间】：2010-12-04 01:53:48 【问题描述】：这些是我的假设，这些是正确的吗？
-
优先使用 CSS 布局
使用表格。
CSS 应该被提取到一个单独的文件中，而不是内联。
CSS 是从位于 site.master 中导入（链接）的，因此所有 .css 都会导入（并应用于）所有 .aspx 页面。
鉴于此，我有一个包含一个母版页和两个 .aspx 页面的项目。这些页面中的每一个都有一个 ID 为“记录”的表。
问题：我可以为每个单独的 .aspx 页面导入一个 .css 文件吗？
有没有更好的方法来作用域单个页面中的 html 元素？
【问题讨论】：
【参考方案1】：设置主题。作为主题一部分的 css 文件将自动导入。
因此，您的每个页面都有一个主题，您可以在内容页面的标记中指定该主题。您定义的每个主题文件夹都将具有您的样式表的适当版本。如果您不想维护多余的 css 声明，您可以将它们分离到另一个文件中并将其链接到主题之外。
【讨论】：
【参考方案2】：让我们看看你的假设。所有这些通常都是正确的，但值得仔细研究一下：
1) 使用 CSS 布局优于使用表格。
有点。更准确地说是 语义 布局 vs 非语义布局，而 CSS 是完成语义布局的常用手段。不同之处在于，有时仅使用语义适当的结构是不可能完成所需的布局的。我会为此吃掉它，但是当面对一大堆不属于的额外 div 标签与单个表之间的选择时，表可能是更好的选择。
2) CSS 应该被提取到一个单独的文件中，而不是内联
有点。 高级 CSS 应该放在同一个文件中。但是您不一定希望整个站点的所有样式都放在同一个文件中，因为这意味着始终拥有只能在单个页面上使用的样式。而且您也不一定希望每个页面都必须下载主 CSS 文件和它自己的 css 文件，因为提高网站性能的方法之一是减少所需的总 http 请求数。因此，您需要考虑某种平衡行为。
3) CSS 是从位于 site.master 中导入（链接）的，因此所有 .css 都会导入（并应用于）所有 .aspx 页面。
有点。 CSS 文件通常链接到页面的头部元素。将内容放在那里的最简单方法就是在母版页中对其进行硬编码。但是如果你真的想的话，你可以从内容页面修改页面的 head 元素。
【讨论】：
【参考方案3】：如果是表格数据 - 使用表格，而不是 CSS。 CSS 用于整体页面布局和单个元素的样式 - 您通常希望在许多页面上保持一致。
当人们说“使用 CSS 而不是表格”时，他们的意思是在整个页面布局中不使用表格（例如页面上的菜单、页眉、页脚和内容所在的位置），而是将表格用于实际表格^^
【讨论】：
【参考方案4】：如果您在母版页中为文档头部保留内容部分，则可以手动链接到不同的 css 文件；但是为什么不为您希望以不同方式显示的项目指定不同的类和 id 并将这些类和 id 放在同一个 css 文件中呢？
所以而不是类似的东西：
<html>
<head>
<link to your css file />
</head>
<body>
<asp:ContentPlaceHolder id="content" runat="server" />
</body>
</html
在您的母版页文件中，您可以这样做：
<html>
<head>
<asp:ContentPlaceHolder id="head" runat="server" />
</head>
<body>
<asp:ContentPlaceHolder id="content" runat="server" />
</body>
</html
然后将不同的 css 文件放在文档头部的新内容占位符中。
【讨论】：
【参考方案5】：除了实际呈现表格（例如表格数据，如电子表格或网格）之外，CSS 优于表格。尽管在一些奇怪的情况下，表格是跨浏览器完成某些效果的唯一方法。主要是——除非你不能，否则总是使用 CSS。然后使用表格:)
对于您的第一个问题 - 当然您可以在单个页面上包含 CSS 文件。你甚至可以使用占位符来做到这一点：
.master:
<head>
<link rel="stylesheet" type="text/css" href="global.css" />
<asp:ContentPlaceHolder runat="server" id="stylesheet" />
</head>
.aspx:
<asp:Content runat="server" ContentPlaceHolderID="stylesheet">
<link rel="stylesheet" type="text/css" href="page_specific.css" />
</asp:Content>
为了将样式范围限定到页面级别，我经常在<body> 标签上放置一个类：
<body class="contact-page">
然后在 CSS 中，我可以针对该页面上应该不同的特定项目：
.contact-page .something h3 .more style
【讨论】：
以上是关于ASP.Net，母版页：每页样式表的主要内容，如果未能解决你的问题，请参考以下文章