IE兼容模式及客户端兼容模式、服务器端兼容模式设置
IE兼容模式:
为了帮助确保网页在将来的 Internet Explorer 版本中具有一致的外观, Internet Explorer 8 引入了文档兼容性。文件兼容性用于定义IE如何渲染网页。
怎么查看当前网页在IE下的兼容性模式:
在浏览器中按F12打开IE开发人员工具,在最上方的工具栏中可以看到浏览器模式和文档模式。
- 浏览器模式影响浏览器的行为表现以及声明的版本号。
- 文档模式影响DOM的转换、渲染操作,影响的是浏览器的外观表现,决定网页显示成什么样子的。
客户端兼容性模式默认设置:
- 外网网站以标准模式来渲染
- 内网网站以兼容模式(IE7兼容模式)来渲染
- 当用IP访问网站时,也是自动以标准模式来渲染,因为IE不能知道ip地址是内网或者外网的
- 当访问本地html文件时,如‘C:\Temp\MyWebPage.htm’,IE8兼容性模式默认也是关闭的
- 兼容性模式是针对域名设置的
- 启用、关闭兼容性模式时,浏览器会自动重新加载(刷新)页面(不需要浏览器重启)
客户端兼容模式设置:
兼容性模式按钮
只有当切换到兼容性视图 有意义的情况下 (譬如当前正以标准模式查看网页), IE才会显示上述按钮 。其他情况下,如正以Quick模式查看页面或者正在查看内网网页(它们自动用兼容性模式来渲染),IE会自动隐藏这个按钮。
Tools菜单下的 兼容性视图以及兼容性视图设置画面
注意:默认情况下,用 兼容性模式(即IE7标准模式)查看内网网站 是被选中的
服务器端兼容模式设置:
即当客户端以兼容性模式视图查看网页时,可以 在服务器上设置以什么标准的兼容性模式来渲染网页 (IE8,IE9下默认启用的是 IE7标准的兼容性模式 )
当客户端以标准模式(非兼容性模式)来查看网页时,服务器端的兼容性模式 不会影响标准模式的渲染 。
若你已于网站服务器指定了一个预设的文件兼容性模式,你可以在个别页面上指定不同的文件兼容性模式来盖过它。 在网页中指定的模式优先权高于服务器中(通过HTTP Header)所指定的模式 。
兼容性模式设置优先级:
X-UA-Compatible是自从IE8新加的一个设置,对于IE8以下的浏览器是不识别的。通过在meta中设置X-UA-Compatible的值,可以指定网页的兼容性模式设置。
例子:
- <meta http-equiv="X-UA-Compatible" content="IE=7" />
- 以上代码告诉IE浏览器,无论是否用DTD声明文档标准,IE8/9都会以IE7引擎来渲染页面。
- <meta http-equiv="X-UA-Compatible" content="IE=8" />
- 以上代码告诉IE浏览器,IE8/9都会以IE8引擎来渲染页面。
- <meta http-equiv="X-UA-Compatible" content="IE=edge" />
- 以上代码告诉IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染页面。
- <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
- <meta http-equiv="X-UA-Compatible" content="IE=7,9" />
IE文档兼容性模式所有可能的值:
- Emulate IE8 mode指示IE使用<!DOCTYPE>指令来决定如何编译内容。Standards mode指令会显示成IE8 Standards mode而quirks mode会显示成IE5 mode。不同于IE8 mode,Emulate IE8 mode重视<!DOCTYPE>指令。
- Emulate IE7 mode指示IE使用<!DOCTYPE>指令来决定如何编译内容。Standards mode指令会显示成IE7 Standards mode而quirks mode会显示成IE5 mode。不同于IE7 mode,Emulate IE7 mode重视<!DOCTYPE>指令。对于许多网页来说这是最推荐的兼容性模式。
- IE5 mode 编译内容如同IE7的quirks mode之显示状况,和IE5中显示的非常类似。
- IE7 mode编译内容如同IE7的standards mode之显示状况,无论网页是否含有<!DOCTYPE>指令。
- IE8 mode提供对业界标准的最高支持,包含 W3C Cascading Style Sheets Level 2.1 Specification和W3C Selectors API,并有限的支持 W3C Cascading Style Sheets Level 3 Specification (Working Draft)。
- Edge mode指示IE以目前可用的最高模式显示内容。当使用IE8时其等同于IE8 mode。若(假定)未来放出支持更高兼容性模式的IE,使用Edge mode的页面会使用该版本能支持的最高模式来显示内容。同样的那些页面在使用IE8浏览时仍会照常显示。
注意事项:
- 1,根据官网定义X-UA-compatible 标头不区分大小写;不过,它必须显示在网页中除 title 元素和其他 meta 元素以外的所有其他元素之前。如果不是的话,它不起作用
- 2,content的内容是IE=8,或者IE=edge等值,注意不是IE8或者直接写个edge的值,否则不起作用
- <h:head>
- <f:facet name="first">
- <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
- <meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
- <title>PrimeFaces Layout</title>
- </f:facet>
- <style type="text/css">
- </style>
- </h:head>
IE兼容模式及客户端兼容模式、服务器端兼容模式设置相关推荐
- SAP UI渲染模式:客户端渲染 VS 服务器端渲染
今年由于疫情原因,SAP一年一度的DKOM(Developer Kick-Off Meeting)切换成了线上模式,刚刚于昨天圆满落幕. 时间过得真快,去年的DKOM仿佛还历历在目:SAP成都研究院数 ...
- apollo local 模式_Java客户端使用指南 - 五、本地开发模式 - 《携程 Apollo v1.4 开发指南》 - 书栈网 · BookStack...
五.本地开发模式 Apollo客户端还支持本地开发模式,这个主要用于当开发环境无法连接Apollo服务器的时候,比如在邮轮.飞机上做相关功能开发. 在本地开发模式下,Apollo只会从本地文件读取配置 ...
- 开发收获(5)IE兼容模式及客户端兼容模式、服务器端兼容模式设置
IE兼容模式: 为了帮助确保网页在将来的 Internet Explorer 版本中具有一致的外观, Internet Explorer 8 引入了文档兼容性.文件兼容性用于定义IE如何渲染网页. 怎 ...
- 介绍了用Meta标签代码让360双核浏览器默认极速模式(google)打开网站不是兼容模式
一个网站,大量采用了html5和css3,希望用户都以webkit内核打开页面,但是测试却发现360的以ie内核打开为推荐模式,不知原因为何.其实360给网站开发者设计了一种选择的方法,只要加入一段M ...
- 计算机开机引导兼容模式,win10电脑Edge浏览器的兼容模式如何开启
win10电脑Edge浏览器的兼容模式如何开启 腾讯视频/爱奇艺/优酷/外卖 充值4折起 今天给大家介绍一下win10电脑Edge浏览器的兼容模式如何开启的具体操作步骤. 1. 打开电脑之后,双击Ed ...
- php如何适应360兼容模式,教你360浏览器开启兼容模式的图文教程
我们在使用电脑时很多时候都需要运行浏览器,但有的用户却跟小编反映说自己想要给360浏览器开启兼容模式但不知道怎么操作,那360浏览器兼容模式怎么设置呢?下面本文就来教大家关于360浏览器开启兼容模式的 ...
- SAP Spartacus服务器端渲染模式下的调试方法
在使用本文章介绍的步骤进行SAP Spartacus Storefront在服务器端渲染模式(SSR)下的调试之前,请您确保已经按照如下帮助文档的介绍,已经成功启用了服务器端渲染: https://s ...
- [ESP8266]--开启服务器模式和客户端模式
[ESP8266]--开启服务器模式和客户端模式 版权声明:本文为博主原创文章,欢迎转载,转载请注明出处. https://blog.csdn.net/wangyijieonline/article/ ...
- daily news新闻阅读客户端应用源码(兼容iPhone和iPad)
daily news新闻阅读客户端应用源码(兼容iPhone和iPad),也是一款兼容性较好的应用,可以支iphone和ipad的阅读阅读器源码,设计风格和排列效果很不错,现在做新闻资讯客户端的朋友可 ...
最新文章
- Chapter11-RMAN Backups
- 方法论、方法论——程序员的阿喀琉斯之踵
- java 堆大小_适当的Java堆大小的5个技巧
- 深夜遭粉丝质问!4天掌握新东方26年教育精华的方法,你怎么不早说?
- python字符串反转方法_Python程序使用堆栈和反转方法反转字符串
- java获取已经打开的串口的输出流_使用Java读取串口的程序(转)
- android中ViewPager详解--视图滑动、界面卡等效果 (三)
- thinkphp ajax 无刷新分页效果的实现
- 结构-行为-样式-有趣的函数
- flume学习(三):Flume Interceptors的使用
- android程序设计背景,android – 以可编程方式设置drawable作为背景
- 通达OA 太牛了!工作流表单设计中级联菜单原来可以这样实现(图文)
- 软件测试功底技术——编程语言
- 【python中级】 ico图标生成器
- python 批量打印PDF
- cloudera安装
- Your app declares support for audio in the UIBackgroundModes key in your Info.plist 错误
- 微信小程序的socket.io即时通讯开发(基于E聊SDK)
- android调起应用商店某应用详情页
- 【陈工笔记】# 微信小程序实现的基础步骤速记,持续更新关键词 #
热门文章
- audio focus
- 【辅助驾驶】激光数据与图像数据的融合[2.1]——普通相机成像与标定
- iOS h264 硬解
- 5.2 Python图像处理之图像编码-哥伦布编码
- android7.1官方下载,Android系统7.1.2 Beta 2正式版
- m0单片机io口_51单片机独立按键和矩阵按键实现
- hadoop2.5.2学习14--MR之协同过滤天猫推荐
- 使用PyG进行图神经网络的节点分类、链路预测和异常检测
- 几个优秀的Wordpress主题汇总(精选免费WP主题)
- 2022年 考研资料更新(7月17)