我想在运行时更改网页上 h1 标题行的背景颜色。如果我们在 prod/dev 中运行,我想相应地设置 H1 标题标签的背景颜色。
我目前正在为 h1 设置背景颜色,如下所示:
align="center" style="background-color: #389BD6 ">HEADER 1 LINE
但我希望能够根据当前环境指定不同的颜色。
我假设它会涉及到 css,但这对我来说是新的,需要一些帮助。
谢谢
最佳答案
CSS:正是医生要求的
您提到的 CSS 是处理此问题的正确方法,您可以简单地定义一个样式来定位您的 h1
元素符合预期:
<style type='text/css'>
h1 {
text-align: center;
background-color: #389BD6;
}
</style>
您可以在您的 HTML 本身(最好在 <head>
部分)或通过外部 CSS 文件(也在您页面的 <head>
部分中定义)明确引用它:
<!-- A reference to a CSS file containing the previous style -->
<link href="your-css-file.css" rel="stylesheet" type="text/css" />
基于环境的样式
关于根据您的环境更改样式,您可以考虑在运行时将 CSS 类添加到页面的高级元素,并添加另一种样式来覆盖以前的默认样式:
<!-- Define a runat="server" tag on your body element and an ID (assumes Web Forms) -->
<body id="body" runat="server">
然后在你的 Page_Load
中事件,根据您的环境(即调试、生产等)设置类:
// Find your body element
var body = FindControl("body") as HtmlGenericControl;
// If you were able to find it, set it's class
if(body != null)
{
// Set your environment here
body.Attributes["class"] = "production";
}
这将在您的 <body>
上呈现“生产”类元素:
<body id="body" class="production">
您可以使用它来定义另一个 CSS 样式以仅针对 <h1>
生产环境中的元素:
<style type='text/css'>
h1 {
text-align: center;
background-color: #389BD6;
}
/* Target <h1> elements in production */
.production h1 {
background-color: purple;
}
</style>
您还可以通过构建多个样式表(即 production.css
、development.css
等)并在其中定义每个特定样式并使用类似 Preprocessor Directives 的机制来实现此目的。以确定使用哪个。
关于C# ASPX 设置h1背景色运行时,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37164673/