ASP.NET:在设置Label控件时,我得到了奇怪的输出

Question

.labelOne { border-width:thin;
            border-style:solid;
            border-color:Red;
            background-color:Silver; }

<asp:Label ID="Label1" runat="server" CssClass="labelOne">
    <h1>Hello world</h1>
</asp:Label>

<br /><br />

<asp:Label ID="Label2" runat="server"
           BorderColor="Black"
           BorderStyle="Solid"
           BorderWidth="1px"
           BackColor="Silver">
    <h1>Hello world</h1>
</asp:Label>

你好.在上面的代码示例中,我有2个Label控件,其内容设置为h1标头标记.第一个Label使用css进行样式设置,第二个使用Label的内联属性(两个标签都具有相同的样式).但是第一个Label没有正确输出,它的边框被打破了.如果我用普通的"Hello world"文本替换第一个Label的标记,它会正确呈现,但是当我使用标记时它会再次中断.有人可以解释为什么会这样吗？

Answer 1

你渲染无效的HTML.标签控件默认将其内容放在span或label html标记内,所以现在当你在标签中放入h1标签时,你在内联元素中有一个块元素,这是无效的.

你应该将你的h1标签包装在标签控件之外,然后可能使用文字控件 - 就像这样:

<h1 class="LabelOne"><asp:Literal ID="Label2" runat="server">
    Hello world
</asp:Literal></h1>

请注意,如果您愿意,也可以轻松地将内联样式应用于h1 ...但不是我建议使用内联样式.