最佳实践：ASP.NET 中的 CSS 或主题？答案

【问题标题】：Best Practices: CSS or Themes in ASP.NET?最佳实践：ASP.NET 中的 CSS 或主题？
【发布时间】：2010-10-04 23:52:13
【问题描述】：

什么时候应该使用 ASP.NET 主题，什么时候应该使用 CSS？使用一个比另一个有什么优点或缺点？

【问题讨论】：

标签： asp.net css themes

【解决方案1】：

一起更好！

但主题不是 CSS 的替代品，或者它们不是为与 CSS 相同的目的而构建的。它的目的是在您的应用程序上定义不同的主题并用一行来更改它们。主题可以包括 CSS 文件、图像文件和皮肤。

使用皮肤，您可以为asp.net 控件定义样式，因此它包含复杂而完整的解决方案。例如，您可以定义一个 gridview 并定义它的样式和属性。您可以在应用程序范围内定义它。

所以你我认为他们在一起更好，但不等于比较。

【讨论】：

您也可以使用大多数 ASP.Net 控件的 CssClass 标记属性来执行此操作。
所以主题仅适用于 Web 服务器控件？
好点。主题也可用于应用程序编程，但就本文而言，它参考了用于 Web 的 ASP.Net。
@loxp - 你的意思是主题也可以在桌面应用程序上使用？我上一条评论的意思是，如果您只能将主题应用于以 <.. element>

【解决方案2】：

我建议在主题上使用 CSS。这样做的原因是在 CSS 中，您可以修改样式以使其适用于所有浏览器。你可以对主题做同样的事情，但微软的设计师因修复你修复的东西而臭名昭著，以使它们在所有浏览器上都能工作，因此适得其反。坚持使用 CSS，你会花更少的时间在胡闹上。

【讨论】：

主题只有在您实现“换肤”类型功能或不熟悉浏览器客户端技术时才真正有意义。
Ishmael，CSS 也非常适合用于蒙皮。只需加载一个不同的 CSS 文件即可。甚至更好。由于 CSS 代表“级联 ...”，您可以覆盖现有的样式定义或将它们组合起来 :)

【解决方案3】：

如果您使用会员、个人资料和个性化，主题会非常方便。除此之外，是的，Visual Studio 设计器是臭名昭著的。如果您考虑到浏览器兼容性，您应该广泛使用 CSS。

【讨论】：

为什么它们在这种情况下很方便？因为现有的控件集成？
@Igor = 基于主题和控件的个性化架构，可以根据成员资格和个人资料非常适合。 codeidol.com/asp/asp.net-illustrated/… 是一个简单的例子

【解决方案4】：

如前所述，它们并不相互排斥。我有机会拥有多个主题，它们本身包含自己的一组 CSS/Media/Skin 文件，这些文件根据站点配置是适当的。

【讨论】：

【解决方案5】：

如果您正在考虑聘请外部设计机构或设计师，那么使用 CSS 会更好，因为 CSS 对他们来说是众所周知的 - 因为主题更加以开发人员/VS 为中心。

【讨论】：

【解决方案6】：

你应该把它们结合起来。将主题文件夹中的 css 文件用于网站中所有 html 元素的正常样式（包括所有生成的元素）。

在控件的皮肤文件中，可以设置默认的css类。其他属性，例如元素的布局和默认行为（示例：日历控件）也可以在此处进行编辑。

皮肤文件适用于所有您无法使用 css 轻松完成的布局特定配置，但使用控件的 .net 属性。

【讨论】：

一个特定于皮肤的示例是 Calendar.DayNameFormat

【解决方案7】：

我建议同时使用两者，我使用主题在控件上设置 css 类，然后在 css 文件中设置它们的样式。示例：

皮肤：

<asp:CompareValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" />
<asp:RangeValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" />
<asp:CustomValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" />
<asp:RegularExpressionValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" />
<asp:RequiredFieldValidator runat="server" Text="*" CssClass="Validator" Display="Dynamic" />
<asp:ValidationSummary runat="server" CssClass="ValidationSummary" />

CSS：

.Validator
{
    color: Red;   
}

.ValidationSummary
{
    font-size: 0.8em;
}

.ValidationSummary > ul
{
    list-style-type: disc;
    padding: 0 0 0 15px; 
    margin: 0;
}

.ValidationSummary > ul > li
{
    padding: 0;
    margin: 0;
    color: Red;
}

【讨论】：