`
qchong
  • 浏览: 17720 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

[CSS HACK]IE6、IE7、IE8、Firefox兼容性问题

阅读更多

1.区别IE和非IE浏览器

#tip {
background
:blue; /*非IE 背景藍色*/
background
:red \9; /*IE6、IE7、IE8背景紅色*/
}

2.区别IE6,IE7,IE8,FF
【区别符号】:「\9」、「*」、「_」
【示例】:
#tip {
background
:blue; /*Firefox 背景变蓝色*/
background
:red \9; /*IE8 背景变红色*/
*background
:black; /*IE7 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/
}
【说明】:因为IE系列浏览器可读「\9」,而IE6和IE7可读「*」(米字号),另外IE6可辨识「_」(底线),因此可以依照顺序写下来,就会让浏览器正确的读取到自己看得懂得CSS语法,所以就可以有效区分IE各版本和非IE浏览器(像是Firefox、Opera、Google Chrome、Safari等)。

3.区别IE6、IE7、Firefox (方法 1)
【区别符号】:「*」、「_」
【示例】:
#tip {
background
:blue; /*Firefox背景变蓝色*/
*background
:black; /*IE7 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/
}
【说明】:IE7和IE6可读「*」(米字号),IE6又可以读「_」(底线),但是IE7却无法读取「_」,至于Firefox(非IE浏览器)则完全无法辨识「*」和「_」,因此就可以透过这样的差异性来区分IE6、IE7、Firefox

4.区别IE6、IE7、Firefox (方法 2)
【区别符号】:「*」、「!important」
【示例】:
#tip {
background
:blue; /*Firefox 背景变蓝色*/
*background
:green !important; /*IE7 背景变绿色*/
*background
:orange; /*IE6 背景变橘色*/
}
【说明】:IE7可以辨识「*」和「!important」,但是IE6只可以辨识「*」,却无法辨识「!important」,至于Firefox可以读取「!important」但不能辨识「*」因此可以透过这样的差异来有效区隔IE6、IE7、Firefox。

5.区别IE7、Firefox
【区别符号】:「*」、「!important」
【示例】:
#tip {
background
:blue; /*Firefox 背景变蓝色*/
*background
:green !important; /*IE7 背景变绿色*/
}
【说明】:因为Firefox可以辨识「!important」但却无法辨识「*」,而IE7则可以同时看懂「*」、「!important」,因此可以两个辨识符号来区隔IE7和Firefox。

6.区别IE6、IE7 (方法 1)
【区别符号】:「*」、「_」
【示例】:
#tip {
*background
:black; /*IE7 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/
}
【说明】:IE7和IE6都可以辨识「*」(米字号),但IE6可以辨识「_」(底线),IE7却无法辨识,透过IE7无法读取「_」的特性就能轻鬆区隔IE6和IE7之间的差异。

7.区别IE6、IE7 (方法 2)
【区别符号】:「!important」
【示例】:
#tip {
background
:black !important; /*IE7 背景变黑色*/
background
:orange; /*IE6 背景变橘色*/
}
【说明】:因为IE7可读取「!important;」但IE6却不行,而CSS的读取步骤是从上到下,因此IE6读取时因无法辨识「!important」而直接跳到下一行读取CSS,所以背景色会呈现橘色。

8.区别IE6、Firefox
【区别符号】:「_」
【示例】:
#tip {
background
:black; /*Firefox 背景变黑色*/
_background
:orange; /*IE6 背景变橘色*/
}
【说明】:因为IE6可以辨识「_」(底线),但是Firefox却不行,因此可以透过这样的差异来区隔Firefox和IE6,有效达成CSS hack。

分享到:
评论
7 楼 snowing11812 2010-03-01  
qchong 写道
snowing11812 写道
<meta http-equiv="x-ua-compatible" content="ie=7" />

把这段代码放到<head>里面,在ie8里面的页面解析就按照ie7规范

我觉得这并不是最终策略

如果有人接到了个遗留的二手项目,又面临这样的问题,可能这种方式比较简便 :-)
6 楼 qchong 2010-03-01  
snowing11812 写道
<meta http-equiv="x-ua-compatible" content="ie=7" />

把这段代码放到<head>里面,在ie8里面的页面解析就按照ie7规范

我觉得这并不是最终策略
5 楼 snowing11812 2010-02-28  
<head>之前也许要添加doctype的声明
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
4 楼 snowing11812 2010-02-28  
<meta http-equiv="x-ua-compatible" content="ie=7" />

把这段代码放到<head>里面,在ie8里面的页面解析就按照ie7规范
2 楼 amonlei 2010-02-26  
其实没必要考虑ie8,因为可以加一段标签让ie8按照ie7的规范跑,多一个ie8的兼容,多一份测试。累
1 楼 healer_kx 2010-02-25  
没仔细看,以至于没理解您的标注方式。。。

相关推荐

    IE6、IE7、IE8、Firefox兼容性CSS HACK代码+示例

    尤其是在处理旧版Internet Explorer(如IE6、IE7、IE8)与现代浏览器(如Firefox、Chrome等)之间的样式差异时,CSS Hack技巧成为了必不可少的工具。本文将深入探讨不同浏览器兼容性的CSS Hack代码及其实例,帮助...

    针对firefox ie6 ie7 ie8的css样式hack

    通过上述介绍可以看出,针对Firefox、IE6、IE7和IE8的CSS Hack是一种有效的解决浏览器兼容性问题的方法。虽然这种方法增加了开发和维护的成本,但对于需要支持多个浏览器版本的项目来说仍然是必要的。在实际应用中,...

    CSS HACK 兼容列表 Firefox,IE5,IE5.5,IE6,IE7,IE8.rar

    这份名为“CSS HACK 兼容列表 Firefox,IE5,IE5.5,IE6,IE7,IE8.rar”的压缩包,提供了针对这些浏览器的CSS Hack解决方案,以确保在不同环境下页面的正常显示。 CSS Hack通常指的是利用浏览器解析CSS的bug或者特性,...

    css解决IE6,IE7,firefox兼容性问题.

    本文旨在详细介绍如何通过 CSS hack 技术以及调整 CSS 属性来解决 IE6、IE7 及 Firefox 之间的兼容性问题。 #### 二、CSS Hack 技术 CSS Hack 是一种特殊的 CSS 编写技巧,用于向特定版本的浏览器提供不同的样式...

    IE6/IE7/IE8/Firefox/Chrome/Safari的CSS hack兼容一览表

    总之,"IE6/IE7/IE8/Firefox/Chrome/Safari的CSS hack兼容一览表" 是一个宝贵的工具,帮助开发者处理跨浏览器的CSS兼容性问题。尽管随着技术的发展,直接使用hack的情况越来越少,但理解这些技巧仍然是解决历史遗留...

    CSS兼容IE6,,IE7,I8 FIREFOX

    本文将详细解析如何通过CSS技巧来解决跨浏览器兼容性问题,特别是针对IE6、IE7、8以及Firefox等浏览器的兼容性处理方法。 #### 二、CSS Hack概述 **CSS Hack**是一种特定的技术手段,用于编写能够被某些特定浏览器...

    CSS hack 针对IE6,IE7,firefox显示不同效果

    而Firefox作为一款遵循标准的浏览器,它的CSS支持相对较好,但也有一些兼容性问题。 为了区分这些浏览器,我们可以通过添加特定的CSS选择器或者属性来实现。一般有以下几种方法: 1. 通过*选择器和!important声明...

    CSS兼容大全IE5,IE5.5,IE6,IE7,Firefox,Opera,Safari等浏览器

    CSS 兼容大全 IE5,IE5.5,IE6,IE7,Firefox,Opera,Safari 等浏览器 CSS 兼容大全是指在不同的浏览器中,例如 IE5,IE5.5,IE6,IE7,Firefox,Opera,Safari 等,如何使网页正常显示的技术。这个技术的核心是 CSS Hack,即...

    IE6、_IE7、IE8、Firefox兼容性问题

    在网页开发中,兼容性问题是一个常见且棘手的问题,尤其是涉及到老版本的Internet Explorer(IE6、IE7、IE8)和Firefox等其他浏览器。这些浏览器对于CSS(层叠样式表)的解析方式存在差异,导致在不同浏览器中页面...

    IE6、IE7、IE8、Firefox、Chrome、Safari的CSS hack兼容一览表

    ### IE6、IE7、IE8、Firefox、Chrome、Safari的CSS Hack兼容一览表 在Web开发过程中,为了确保网站能够在不同的浏览器中保持一致的显示效果,开发者常常需要运用CSS Hack技术来解决浏览器间的兼容性问题。CSS Hack...

    CSS样式兼容IE6、IE7、IE8、FF火狐浏览器的方法

    通过深入了解各浏览器的特性与限制,结合CSS Hack技巧和现代开发工具,可以有效地解决跨浏览器兼容性问题,确保网站在各种环境下都能提供一致的用户体验。虽然IE6、IE7和IE8的市场份额已大幅下降,但对于仍需支持...

    简单CSShack:区分IE6、IE7、IE8、Firefox、Opera().pdf

    在《简单CSShack:区分IE6、IE7、IE8、Firefox、Opera》中,作者介绍了两种主要的方法来针对这些浏览器进行CSS样式区分。 方法一主要依赖于特殊的CSS选择器来区分浏览器。以下是对四种特殊符号的测试结果: 1. `&gt;`...

    div+css兼容ie6ie7ie8ie9和FireFoxChrome等浏览器方法[借鉴].pdf

    本文将深入探讨如何使CSS样式兼容IE6、IE7、IE8、IE9以及Firefox、Chrome等现代浏览器。 1. **DOCTYPE声明的影响**: DOCTYPE声明对于浏览器的渲染模式至关重要。在HTML文档的顶部加入正确的DOCTYPE,如`&lt;!DOCTYPE...

    div+css 完全兼容 样式兼容性 ie6 ie7 IE8 IE9 和firefox方法

    然而,由于不同浏览器对CSS标准的支持程度不一,尤其是在IE6、IE7、IE8、IE9和Firefox之间存在兼容性问题,开发者需要采取特殊策略来确保页面在这些浏览器上正常显示。本文将深入探讨如何实现`div+css`的完全兼容。 ...

    CSS在IE6, IE7, IE8, Firefox中的特定使用(Hack).

    标题与描述中所提及的知识点聚焦于CSS在不同浏览器(尤其是IE6, IE7, IE8及Firefox)中的兼容性问题及其解决方案——即所谓的“Hack”技术。在Web开发领域,由于不同浏览器对CSS的支持程度和解析方式存在差异,...

    ie6、ie7、ie8、ie9、ie10、firefox、google chrome浏览器Hack及兼容性演示页面

    这里我们将深入探讨标题中提到的`ie6`到`ie10`以及`Firefox`和`Google Chrome`浏览器的兼容性问题,以及它们所基于的`Gecko`和`WebKit`内核。 首先,`IE6`至`IE10`是微软公司推出的一系列Internet Explorer浏览器,...

    ie6/7/8的 css hack

    【CSS Hack】在Web开发中,CSS Hack是一种特殊的技术,用于解决不同浏览器对CSS解析的差异,特别是针对老版本的Internet Explorer(IE6、IE7和IE8)的兼容性问题。这些浏览器在解析CSS时存在诸多不一致,导致设计师...

    IE6、IE7、Firefox之间的兼容写法

    通过本文介绍的各种CSS Hack技巧,可以有效解决IE6、IE7以及Firefox之间的兼容性问题。然而,在实际开发中,我们还应考虑更多的现代浏览器,如Chrome、Safari等,并尽可能采用更标准、更易于维护的方式来编写CSS代码...

    CSS完美兼容IE6_IE7_FF的通用方法

    本文将探讨一种通用方法来解决CSS在IE6、IE7及Firefox中的兼容性问题,通过使用特定的CSS Hack技巧,使网页能够优雅地适应这些浏览器。 #### CSS Hack详解 **1\. IE6/IE7与Firefox的CSS Hack** 在CSS中,可以通过...

    兼容cssie6 7 8

    本篇文章将详细介绍如何通过CSS Hack来实现对IE6、IE7、IE8以及Firefox的兼容。 首先,我们需要理解不同浏览器之间的差异。Firefox通常对CSS标准支持较好,而IE6、IE7、IE8则存在各种解析上的问题,如盒模型、浮动...

Global site tag (gtag.js) - Google Analytics