Question

我有一个嵌套的div（见下文），它有不同的CSS类来为容器提供背景颜色和文本的格式

<div class="section">
    <div class="sectionTitle">
        <dx:ASPxLabel ID="lblSectionTitle" runat="server" Text='<%# Eval("SectionTitle") %>'></dx:ASPxLabel>
    </div>

    <div class="sectionTitle">
        <dx:ASPxLabel ID="lblSectionDesc" runat="server" Text='<%# Eval("SectionDescription") %>'></dx:ASPxLabel>
    </div>

div部分有一个结束标记，其中有更多内容正确呈现。

以上的CSS是：

.section
{
    padding: 5px; 
    background-color: #ffffff; 
}

.sectionTitle
{
    font-size: 11px; 
    font-family: Arial; 
    font-weight: bold;
    color: #546fb2;
}

当我在.section中注释掉背景颜色时，正在应用sectionTitle的格式，但当我将背景颜色放在那里时，它会覆盖sectionTitle的颜色。我已经尝试将.section的颜色设置为匹配.sectionTitle但这仍然不起作用。

在每个浏览器中（IE9不兼容，Firefox，Chrome），它工作正常，我已经看了几个小时了，因为我无法发现这个问题，所以有点令人沮丧。

内容位于ASP.NET页面上，该页面使用具有doctype：

的MasterPage

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

有人可以帮忙解释一下吗？

提前致谢

安迪

Answer 1

Internet Explorer具有兼容性＆＃34;功能＆＃34;它始终以兼容模式呈现本地网络上的站点。你必须以两种方式之一明确地关闭它。

<meta http-equiv="x-ua-compatible" content="ie=edge" />

此边缘标记告诉ie始终呈现它支持的最标准模式。

如果你使用像asp.net或php这样的服务器端技术，那就是使用另一种方法（我更喜欢），这就是添加一个http标头（在asp.net中这是在global.asax，也是chrome如果已安装，则= 1启用chromeframe：

protected void Application_BeginRequest() 
{ 
    Response.Headers.Add("X-UA-Compatible", "IE=edge, Chrome=1"); 
}

编辑：

还有第三种方法，可以在“Internet选项”的兼容性视图选项卡中禁用它。但是，这只会影响您的计算机。

此外，如果可能的话，最好使用头方法，而不是使用元标记方法。当浏览器读取元标记时，它已经处于主要模式。元标记仅影响文档呈现模式，而不影响浏览器兼容模式。在某些情况下，存在微妙的差异，可能会产生影响。

Answer 2

尝试将此添加到标题

 <meta http-equiv="x-ua-compatible" content="ie=emulateie9" />

在IE9上按F12键，如果有文档模式Qirks，则必须通过元标记修复它。也许这是你的问题。

兼容模式下的IE9无法正确显示CSS样式

2 个答案: