IE条件语句显示div,即使条件说它不应该 [英] IE conditional statement displaying div even though the condition says it shouldn't

查看:192
本文介绍了IE条件语句显示div,即使条件说它不应该的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个奇怪的问题,我希望有人之前遇到过这个并解决了这个或知道这个问题,并且知道造成这个问题的原因。

I am having a peculiar problem and I am hoping someone has encountered this before and solved this or knows about this issue and has good knowledge as what is causing this.

我正在使用HTML5-Boilerplate v4.3.0创建一个站点,并且我有IE的常规条件语句(强制浏览器使用最新的渲染引擎),如此处所示......

I am creating a site using HTML5-Boilerplate v4.3.0 and in that i have the regular conditional statements for IE ( to force browser to use the latest rendering engine) like shown here...

<!--[if HTML5]><![endif]-->
<!doctype html>
<!--[if lt IE 7]>      <html class="ie ie6 lte9 lte8 lte7" lang="en"> <![endif]-->
<!--[if IE 7]>         <html class="ie ie7 lte9 lte8 lte7" lang="en"> <![endif]-->
<!--[if IE 8]>         <html class="ie ie8 lte9 lte8" lang="en"> <![endif]-->
<!--[if IE 9]>         <html class="ie ie9 lte9" lang="en"> <![endif]-->
<!--[(gte IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

<head>
    <!--[if !HTML5]>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <![endif]-->
    <meta charset="utf-8">  ....
    <!--- End Meta tags -->

现在我的这些代码基于链接在这里此链接以及安德鲁发布的SO答案这里。

Now I have these codes based on the link here , this link and also the SO answer posted by andrew here.

我还在body标签中有一个小的条件语句,它以IE为目标,如果版本是小于9然后显示如此处所示的div ...

I also have a small conditional statement in the body tag which targets the IE and if the version is less than 9 then it displays a div like shown here...

<body>
    <!--[if lt IE 9]>
        <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please upgrade your browser to improve your experience. This site was designed to work with modern browsers like Internet Explorer 9 or above, Firefox, Chrome, etc.</p>
    <![endif]-->
   .......
</body>

browsehappy类的css元素就像这样......

the css element for the class "browsehappy" goes like this...

.browsehappy {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
position:fixed;
top: 0;
left: 0;
z-index: 1000;
background-color: #fff;
font-size: 14px;
width: 100%;
text-align: center;
}

我正在运行IIS7和/或基于apache的Xampp作为我的网络服务器。我知道在许多在线帮助网站中,他们说强制IE在特定模式下打开的最佳方法是使用服务器配置文件。因此我创建了文件......

I am running IIS7 and/or apache based Xampp as my webserver. And I know in many online help sites they say the best method to force IE to open in a particular mode is to use server configuration files. hence i created the files...

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <httpProtocol>
      <customHeaders>
        <clear />
        <add name="X-UA-Compatible" value="IE=10" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>
</configuration> 

IIS7的web.config和...

web.config for IIS7 and...

<IfModule mod_headers.c>
    Header set X-UA-Compatible "IE=edge"
    # `mod_headers` can't match based on the content-type, however, we only
    # want to send this header for HTML pages and not for the other resources
    <FilesMatch "\.(appcache|crx|css|eot|gif|htc|ico|jpe?   g|js|m4a|m4v|manifest|mp4|oex|oga|ogg|ogv|otf|pdf|png|safariextz|svgz?|ttf|vcf|webapp|webm|webp|woff|xml|xpi)$">
        Header unset X-UA-Compatible
    </FilesMatch>
</IfModule>

apache的.htaccess的一部分

part of .htaccess for apache

如果我的文件夹中包含html文件的服务器配置文件,一切正常。

Everything works just fine if I have the server config files in my folder with the html files.

但我的部分问题是我没有任何控制甚至访问权限到网站将要驻留的最终网络服务器。所以我必须提出一个不涉及服务器配置文件的解决方案。

But part of my problem is that I dont have any control over or even access to the final webserver the site is going to reside in. So I have to come up with a solution that does not involve server config files.

现在条件声明在top,在head标签之前,似乎正在工作。在IE9中打开时,它打开IE 9兼容性视图浏览器模式和IE9标准文档模式(相对于IE7文档模式和IE9可共同性)

Now the conditional statement at the top , before the head tag, seems to be working. When opened in IE9 it opens up in IE 9 compatibility view browser mode and IE9 standards documents mode (as opposed to IE7 documents mode and IE9 comaptibility)

但是,条件语句身体标签内部无法正常运作。现在我已经提到,因为我无法控制网站的最终网络服务器,我从根文件夹中删除了配置文件,并使用元标记方法强制浏览器。

But, the conditional statement inside the body tag is not functioning right. Now as i had mentioned since i dont have control over the final webserver of the site, i removed the config files from the root folder and used the meta tag approach to force the browser.

即在IE9中打开时没有根文件夹中的服务器配置文件的屏幕截图。使用配置文件,它的行为正确。

that is my screenshot when opened in IE9 without the server config files in the root folder. With the config files it behaves correctly.

现在我的问题是,即使浏览器在IE9模式下打开,为什么该部门会出现?

Now my question is even though the browser is opened in the IE9 mode why is the division showing up?

任何帮助将不胜感激。提前致谢。
p.s:输出在ie11中打开时工作正常。没有在ie10中测试过。

Any help would be greatly appreciated. Thanks in advance. p.s: output works fine when opened in ie11. have not tested in ie10.

推荐答案

由于网站在IE9 Compat View中打开,我怀疑你是在本地托管这个页面正在Intranet区域中加载。如果您在互联网上托管,这将影响结果。您可以(暂时)取消选中IE兼容性视图设置中的在兼容性视图中显示Intranet站点设置,以查看是否会更改结果。

Since the site opens in IE9 Compat View, I suspect that you are hosting this locally and the page is loading in the Intranet Zone. This will affect the results compared to if you host on the internet. You might (temporarily) uncheck the "Display intranet sites in Compatibility View" setting in IE's Compatibility View settings to see if this changes the result.

这篇关于IE条件语句显示div,即使条件说它不应该的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆