条件 HTML 语句未按预期工作答案

【问题标题】：Conditional HTML statements not working as expected条件 HTML 语句未按预期工作
【发布时间】：2020-10-23 05:04:31
【问题描述】：

我正在尝试修复我最近创建的一些网页的一些 IE 错误，因为我们有一些内部员工仍在使用旧版本的 IE。我正在为 IDE 使用 Visual Studio 2019。

引用css-tricks.com 中的示例，我将以下示例应用于aspx 页面中的html：

<!--[if gte IE 7]>
    <link rel="stylesheet" href="css/style_IE.css?id=173" />
<![endif]-->
<!--[if !IE]> <! -->
    <link rel="stylesheet" href="css/style.css?id=173" />
<!--<![endif]-->

如果我删除条件并且一次只使用一个样式表，那么当我将相应的 vs 2019 IIS Express Web 浏览器设置为匹配时，它们每个都可以正常工作。一般来说，Chrome 和 Firefox 都在单独使用 style.css ...我正在尝试修复的只是 IE/Edge。

我见过其他 example conditionals 没有最后一个条件“”：

<!--[ ... ]> <! -->

当我应用“

标签： html css asp.net internet-explorer conditional-statements

【解决方案1】：

您似乎正在使用 IE 10 或 IE 11 浏览器进行测试。这就是您无法正确查看结果的原因。

IE 10 和 IE 11 不支持条件 cmets。

如果您也想为其应用自定义 CSS，那么您需要使用媒体查询。

测试代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication3.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <%-- Below code is for browsers except IE --%>
    <![if !IE]>
        <link href="css/normal.css" rel="stylesheet" />
    <![endif]>
    
     <%-- Below code is for IE 7, IE 8, IE 9 --%>
    <!--[if gte IE 7]>
        <link href="css/ie_specific.css" rel="stylesheet">
    <![endif]-->

    <%-- Below code is for IE 10, IE 11--%>
    <style>
    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) 
    {
     
        body 
        {
            background-color: red;
        }
    }
    </style
</head>
<body>
   
    <form id="form1" runat="server">
        <div>
            <h2>Hello... This is sample text</h2>
        </div>
    </form>
</body>
</html>

测试结果：

您可以尝试更改 IE 11 浏览器开发者工具中的文档模式，以查看旧版本 IE 浏览器的结果。

我希望上面的例子能帮助你消除困惑。如果您有任何问题，请告诉我。

【讨论】：

谢谢 Deepak-MSFT！这对我的问题很有帮助。