Question

我想在运行时更改网页上h1标题行的背景颜色。如果我们在prod / dev中运行，我希望相应地设置H1标头标签的背景颜色。

我目前正在为h1设置背景颜色，如下所示：

 align="center" style="background-color: #389BD6 ">HEADER 1 LINE

但我希望能够根据当前环境以不同方式指定颜色。

我假设它会涉及到css，但这对我来说是新的，需要一些帮助。

由于

Answer 1

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";
}

这将使＆＃34;生产＆＃34; <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之类的机制来确定哪个可以使用。

Answer 2

如果您需要它是动态的，您可以执行以下操作：

<link href="http://somewebsite.com/css.aspx" type="text/css" rel="stylesheet">

这样你就有一个被视为css文件的aspx文件，但你可以动态设置h1背景颜色的值，例如，通过在.aspx中使用你想要的任何逻辑但只使用此样式表来包含可能在运行时更改的样式，因为它会产生大量开销。

C＃ASPX设置h1背景颜色运行时

2 个答案: