您现在的位置是:首页 > 文章详情文章详情

X-UA-Compatible 解决IE浏览器样式不兼容问题

会飞的猪 2018-09-21 635人已围观

简介白码驿站是一个面向开发者的知识共享社区,专注于为开发者打造一个纯净的技术交流社区(源码下载,免费在线图片压缩,jquery插件,插件下载,JS/CSS在线压缩。)-白码驿站

        最近遇到一个头疼的事情,就是ie浏览器不兼容问题,改起来真的叫一个头疼, 没办法, 还是得改, 虽说ie浏览器不好用, 很多诟病,一直被开发人员所吐槽,但是没办法, IE浏览器在全球还是占很大一部分市场,所以, 只要有ie存在,就会有浏览器不兼容问题。好了,不扯远了, 来看一下如何解决IE浏览器不兼容的问题吧。

问题:

      项目中有一个上传图片的功能,并可以实时查看上传的图片,为了提高用户的体验度,我使用的是ajax+html5静态上传图片,从文档流中加载图片(上传的图片没有直接传到后台,点击提交按钮才去提交图片),本来是一个“高大上”的功能,在Chrome浏览器上测试那叫一个顺畅, 结果项目快交付的时候, 发现客户使用ie浏览器, 结果“高大上”的上传功能成了“bug”了,心里瞬间一万头草泥马奔腾而来,为了解决不兼容问题, 可谓是“踏破铁鞋无觅处,得来费了不少功夫”。


解决办法:

        解决办法有两种,一个是从客户端下手,一个是从服务器下手, 首先来讲解一下从客户端下手的方法,

一、客户端解决办法:

                                        

                                

使用X-UA-Compatible属性,在将解属性前,先来看看百度的页面,

X-UA-Compatible 解决IE浏览器样式不兼容问题


百度的页面也是用了标签,


这个标签的作用是:

1. X-UA-Compatible为我们定义了浏览器的渲染方式;

2.如果存在客户端Chrome Frame并启用,那么浏览器访问页面会被Chrome内核渲染(这一点没太大意义,因为你开发的项目不能要求用户在客户端来安装Chrome Frame);也就是说IE浏览器变身Chrome是可以的,但前提是客户端安装了Chrome Frame,如果客户端安装了Chrome,那还有ie什么事;

3.使用IE内核浏览器来访问,会渲染至该浏览器的最高版本,比如你使用IE11浏览器,那么就算在兼容模式切换至IE8,但仍会渲染成IE11的样子(当然IE8浏览器是不会渲染成IE11的,只能渲染内核的最高版本)。


二、服务器端解决办法:

可以在服务器端设置IIS https响应头,起始原理和方法一听相似,就是服务器响应的时候告诉ie浏览器使用指定内核来渲染 (使用ie多少是由我们控制的,但是不能高于浏览器的最高内核)。


具体设置方法:打开 IIS-》选择一个站点-》双击右侧的 HTTP响应表头

X-UA-Compatible 解决IE浏览器样式不兼容问题


双击下图所所示,

X-UA-Compatible 解决IE浏览器样式不兼容问题

名称:X-UA-Compatible

值:IE=EmulateIE7(如果填写IE=EmulateIE8,表示页面使用ie8的内核,依次类推。)

X-UA-Compatible 解决IE浏览器样式不兼容问题

然后点击确定就好了。


Tags: Html

很赞哦! (4)

系统处理中...