前端 解决IE兼容问题

简介: 前端 解决IE兼容问题

在HTML中添加如下代码:

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">


可以指定网页的兼容性模式设置,告诉IE以最高级模式渲染文档,任何IE版本都以当前版本所支持的最高级标准模式渲染,避免版本升级造成的影响。


Google Chrome Frame(谷歌内嵌浏览器框架GCF)。这个插件可以让用户的IE浏览器外不变,但用户在浏览网页时,实际上使用的是Google Chrome浏览器内核,而且支持IE6、7、8等多个版本的IE浏览器


chrome=1 用以声明当前页面用chrome内核来渲染。


IE=edge,chrome=1 这样写可以达到的效果是如果安装了GCF,则使用GCF来渲染页面,如果未安装GCF,则使用最高版本的IE内核进行渲染。


X-UA-Compatible是自从IE8新加的一个设置,对于IE8以下的浏览器是不识别的。在网页中指定的模式优先权高于服务器中(通过HTTP Header)所指定的模式。


网页的浏览器兼容的重要性:


1、网站做好了浏览器兼容,能够让网站在不同的浏览器下都正常显示


2、浏览器兼容能够抓住更多的网站访客


3、浏览器兼容能够给客户更好的体验


注意事项:


1,根据官网定义X-UA-compatible 标头不区分大小写;不过,它必须显示在网页中除 title 元素和其他 meta 元素以外的所有其他元素之前。如果不是的话,它不起作用。


2,content的内容是IE=8,或者IE=edge等值,注意不是IE8或者直接写个edge的值,否则不起作用。

目录
相关文章
|
前端开发 JavaScript 测试技术
前端常见兼容问题系列8: 安卓机器中通过JS设置焦点无法拉起软键盘
有时候,为了优化用户体验,做交互设计的同学可能会希望让输入框自动获得焦点并弹出软键盘,这样用户不用点击输入框就可以直接输入。的确,这对用户来说很方便。但真正用HTML5页面去实现的时候,却遇到了问题。 首先我做了这样一个demo。 ``` Title #input1{
3943 0
|
Web App开发
clearTimeout 方法在IE上的兼容问题
clearTimeout 方法在IE上的兼容问题
70 0
|
JavaScript 前端开发
DZMFullPage - 前端分页动画插件,兼容IE9+,支持Vue
DZMFullPage - 前端分页动画插件,兼容IE9+,支持Vue
105 0
|
移动开发 前端开发 HTML5
web页面实现全背景视频功能方案:使用bideo.js来处理object-fit在ie浏览器下不兼容问题
web页面实现全背景视频功能方案:使用bideo.js来处理object-fit在ie浏览器下不兼容问题
236 0
web页面实现全背景视频功能方案:使用bideo.js来处理object-fit在ie浏览器下不兼容问题
|
前端开发
轻量级前端路由 router directorjs兼容ie8
轻量级前端路由 router directorjs兼容ie8
139 0
|
Web App开发 编解码 移动开发
前端面试:所问到的兼容问题
前端面试:所问到的兼容问题
466 0
|
Web App开发 前端开发 测试技术
前端常见兼容问题系列6: 一些安卓APP的WebView中<input type="file">不工作
安卓APP的WebView默认屏蔽了该控件的使用,有些安卓APP之所以能支持文件选择和上传,主要可能是有可能采取了如下措施之一: (1)可能在该APP中重写了相关方法 (2)提供了JS Bridge来供web页面调用
10186 2
|
Web App开发 前端开发 测试技术
前端常见兼容问题系列3:永远置于顶层的video
在许多安卓手机的UC浏览器中,存在video标签无法被元素遮盖的情况,有可能是UC把video解析成了native控件所致。 Title .content{ position: fixed;
3905 0
|
Web App开发 JavaScript 前端开发
下一篇
无影云桌面