【发布时间】:2013-05-01 21:52:33
【问题描述】:
我试图能够通过数据库中的字段动态更改 CSS 属性。我知道我可以放入一堆这样的 if 语句。
if (@Model["font"] == "arial")
//set the font to arial
这可行,但会使我的观点混乱。我想知道是否有人对此有更优雅的解决方案。任何帮助将不胜感激。
【问题讨论】:
标签: c# css asp.net-mvc html razor
我试图能够通过数据库中的字段动态更改 CSS 属性。我知道我可以放入一堆这样的 if 语句。
if (@Model["font"] == "arial")
//set the font to arial
这可行,但会使我的观点混乱。我想知道是否有人对此有更优雅的解决方案。任何帮助将不胜感激。
【问题讨论】:
标签: c# css asp.net-mvc html razor
这里有一些不错的选择:
将样式块直接添加到视图中(正如 Matthew 建议的那样)。通常样式应该放在单独的文件中,但这样做的一些动机(例如重用)会因为您的源是动态的而消失。
您可以生成/缓存从控制器或其他 HTTP 处理程序提供的样式表。 dotless(.Net 的 LESS CSS 预处理库)正是这样做的;它需要一个源,将其处理成纯 CSS,然后缓存结果。
您可以在控制器中使用 DOM 生成一些 HTML,并应用内联样式。这种技术对于 WYSIWYG 编辑器生成的 HTML 非常有用,因为它们通常会生成低于标准的标记并且需要内联进行调整。
如果您真的想要“花哨”,您可以考虑将模型的属性集成到 LESS CSS 中。我设想了一个预处理步骤来解析模型值,然后允许进行正常的 LESS 预处理(可能使用无点)。
说到 LESS CSS,您也许可以将所有可配置的值提取到不同的文件中,然后根据数据库中的值选择正确的变量文件。这会将实际样式完全排除在数据库之外。
【讨论】:
如果你不需要任何额外的逻辑,你可以在模型中逐字输出值。
body {
font-family: @Model["font"]
}
【讨论】: