方法:要在页面中加入如下HTTP meta-tag:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

只要IE8一读到这个标签,它就会自动启动IE7兼容模式,保证页面完整展示。

由于不同的浏览器,比如Internet Explorer 6,Internet Explorer 7,Mozilla Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。

这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。

区别不同浏览器,CSS hack写法:

区别IE6与FF:

background:orange;
      *background:blue

区别IE6与IE7:

background:green !important;
       background:blue;

区别IE7与FF:

background:orange;
       *background:green;

区别FF,IE7,IE6:

background:orange;
      *background:green !important;
      *background:blue;

注:

IE都能识别*;标准浏览器(如FF)不能识别*;

IE6能识别*,但不能识别 !important,

IE7能识别*,也能识别!important;

FF不能识别*,但能识别!important;

另外再补充一个,下划线"_",

IE6支持下划线,IE7和firefox均不支持下划线。

于是大家还可以这样来区分IE6,IE7,firefox

background:orange;*background:green;_background:blue;

----------------------------------------

HACK对照表

----------------------------------------

  IE6 IE7 FF
_ × ×
* ×
!important ×

----------------------------------------

注:不管是什么方法,书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在最后面。

解决IE7、IE8样式不兼容问题的更多相关文章

  1. div错位/解决IE6、IE7、IE8样式不兼容问题

    IE6里DIV错位的问题    原文:chinafine 采用”FLOAT:LEFT“的DIV在IE8.IE7.都没问题,IE6下却向下移动,出现空白.这是因为,IE6采用的内核默认把DIV之间的距离 ...

  2. div错位解决IE6、IE7、IE8样式不兼容问题

    IE6里DIV错位的问题       采用”FLOAT:LEFT“的DIV在IE8.IE7.都没问题,IE6下却向下移动,出现空白.这是因为,IE6采用的内核默认把DIV之间的距离增加了3~5个PX, ...

  3. ie6,ie7,ie8 css bug兼容解决记录

    ie6,ie7,ie8 css bug兼容解决记录 转载自:ie6,ie7,ie8 css bug兼容解决记录 - 前端开发 断断续续的在开发过程中收集了好多的bug以及其解决的办法,都在这个文章里面 ...

  4. ie6,ie7,ie8 css bug兼容解决方法

    IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 这里收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决,也希 ...

  5. ie6,ie7,ie8,FF 浏览器兼容问题

    javascript部分 1. document.form.item 问题问题:代码中存在 document.formName.item("itemName") 这样的语句,不能在 ...

  6. 解决iframe IE8透明不兼容

    要使 ie8 的 iframe 的透明,需要设置两点: 设置 iframe 的 allowTransparency 属性值为 true: <iframe allowtransparency=&q ...

  7. 如何有效地解决ie7,IE8不支持document.getElmentsByClassName的问题

    1.复制此代码到你js代码的最前面即可   if(!document.getElementsByClassName){ document.getElementsByClassName = functi ...

  8. DIV+CSS解决IE6,IE7,IE8,FF兼容问题

    1.IE8下兼容问题,这个最好处理,转化成IE7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了:1. <metahttp-equivmetahttp-equiv ...

  9. DIV+CSS解决IE6,IE7,IE8,FF兼容问题(转至http://www.douban.com/note/163291324/)

    2011-07-25 21:11:47     DIV+CSS解决IE6,IE7,IE8,FF兼容问题 1.IE8下兼容问题,这个最好处理,转化成IE7兼容就可以.在头部加如下一段代码,然后只要在IE ...

随机推荐

  1. 前端开发人员要注意的css规范,css命名。

    刚工作的时候也没注意关于css的规则,根据自己的心情想怎么用就怎么用,完成工作就好不会考虑代码的可读性,加载的性能,现在身为前端的一员就要有程序员的自我修养(嘿嘿,是不是很有责任感啊). 废话不多说, ...

  2. MyBatis数据持久化(十)与Spring4整合

    前面几节介绍了mybatis的基本使用方法,本节主要介绍如何使用mybatis与主流的IoC容器Spring进行整合. 我们首先需要获取Spring框架的jar文件,在写本文时spring的最新Rel ...

  3. px 与 pt

    px:pixel,像素,屏幕上显示的最小单位,用于网页设计,直观方便: pt:point,是一个标准的长度单位,1pt=1/72英寸,用于印刷业,非常简单易用: em:即%,在CSS中,1em=100 ...

  4. Android自定义日历控件(继承系统控件实现)

    Android自定义日历控件(继承系统控件实现) 主要步骤 编写布局 继承LinearLayout设置子控件 设置数据 继承TextView实现有圆圈背景的TextView 添加Attribute 添 ...

  5. maridb Error 'Operation DROP USER failed for

    数据库版本:mariadb   10.0.12 主库删除多余的用户名,因从库没有此信息造成主从故障! 报错信息如下:Error 'Operation DROP USER failed for 'use ...

  6. Lucene倒排索引结构及关系

  7. pythone 学习笔记(粗略)

    文档目录 概述 安装 基本语法 数据结构 4.1 数字和字符串类型 4.2 元祖 4.3 列表 4.4 字典 流程语句 5.1 分支结构 5.2 逻辑运算符(if) 5.3 循环 5.3.1 for ...

  8. 使用展开操符作替代 .apply() (prefer-spread)

    在ES2015以前,你必须使用Function.prototype.apply()来调用可变函数. var args = [1, 2, 3, 4]; Math.max.apply(Math, args ...

  9. HTML5 基础测试题

          HTML5 基础测试题 1.HTML5 之前的 HTML 版本是什么?() A.HTML 4.01 B.HTML 4 C.HTML 4.1 D.HTML 4.9 2.HTML5 的正确 d ...

  10. nignx 502错误不能使用/的路径方式 即pathinfo

    在server中加入 include enable-php-pathinfo.conf; 引入nginx.conf下的这个文件即可. 如果是tp框架,主要隐藏index.php的入口文件,再加入下面这 ...