自从安装了IE8.0正式版本!木头 就对基本的几个 CSS 
HACK的做一下归纳!希望对网页前端布局DIV+CSS的实施者有所帮助!

本文就主要以:IE6+IE7+IE8+IE9+FF为主要研究对象

HACK原理:不同浏览器对各中字符的识别不同 
(读完文章你会发现,FF和IE8对以下字符的识别能力完全相同)

在 
CSS中常用特殊字符识别表:

(1)* : IE6+IE7 都能识别*,而标准浏览器FF+IE8是不能识别*的;

(2)!important : 
除IE6不能识别 !important外, FF+IE8+IE7 都能识别!important 
;

(3)_ : 除IE6 支持_ 外, FF+IE8+IE7都不支持_;

(4)\9 :所有IE 浏览器都识别(IE6、IE7、IE8、IE9)

示例:

(1)区别FF(IE8)与IE6 
IE7

backgorund:orange; FF和IE8背景色将为橘黄色

*backgorund:red; IE6和IE7背景色将为红色

(2)区别FF(IE8)与IE6与IE7

background:orange; FF和IE8背景色将为橘黄色

*background:red 
!important; IE7背景色将为红色

*background:blue; IE6背景色将为蓝色

(3)区别FF(IE8)与IE6与IE7

background:orange; FF和IE8背景色将为橘黄色

*background:red; IE7背景色将为红色

_background:blue; IE6背景色将为蓝色

(4)区别FF与IE6 
IE7 E8

color:gray;  
FF等非IE浏览器字体色将为灰色

color:red\9;  
IE8 IE9字体色将为红色

*color:green;  
IE7字体色将为绿色

_color:blue;  
IE6字体色将为蓝色

提示:CSS 
HACK书写顺序:先写FF等非IE浏览器所需样式,其次写IE8所需样式,接着是IE7的,再接着才是IE6的!

总结:实际运用中我感觉比较少用到!important 
,只要你记住"*"和"_"我想就足够区别于FF(IE8)与IE6与IE7了.

==========================================================

1、Css if hack条件语法 
< !--[if IE]> 
Only IE <![endif]--> 
仅所有的WIN系统自带IE可识别
< !--[if IE 5.0]> Only IE 5.0 
<![endif]--> 
只有IE5.0可以识别
< 
!--[if gt IE 5.0]> Only IE 5.0+ 
<![endif]--> 
IE5.0包换IE5.5都可以识别
< !--[if lt IE 6]> Only IE 6- 
<![endif]--> 
仅IE6可识别
< !--[if 
gte IE 6]> Only IE 6/+ <![endif]--> 
IE6以及IE6以下的IE5.x都可识别

<!--[if lte IE 7]> Only IE 7/- 
<![endif]--> 
仅IE7可识别
< !--[if 
gte IE 7]> Only IE 7/+ 
<![endif]--> 
IE7以及IE7以下的IE6、IE5.x都可识别

<!--[if IE 8]> Only IE 8/- 
<![endif]--> 
仅IE8可识别

<!--[if IE 9]> Only IE 9/- 
<![endif]--> 
仅IE9可识别

注 :在 if  后加 lt gte有不同效果 (参加其它参数同理)

<!–[if IE 8]> = IE8 仅IE8可识别 
<!–[if lt IE 8]> = IE7或更低版本

<!–[if gte IE 8]> = 高于或者等于IE8版本

2、DIV+CSS实例 
CSS实例一:
让IE6-IE8显示不同的内容,DIV CSS代码如下:

<!DOCTYPE 
html>
<html>
<head>
<meta http-equiv="Content-Type" 
content="text/html; charset=utf-8" />
<title>DIV 
IF条件实例</title>
</head>
<body>
你正在使用:
<!--[if IE 
7]> 
<h2>IE7</h2>
<![endif]-->
<!--[if IE 
6]> 
<h2>IE6</h2>
<![endif]-->
<!--[if IE 
8]> 
<h2>IE8</h2>
<![endif]-->

<!--[if IE 9]>

<h2>IE9</h2>
<![endif]-->
<br><br>
<strong>说明</strong>:如果你的浏览器版本为多少即会显示IE多少,针对IE6-IE9实验</body>
</html>

说明:以上针对不同IE显示不同网页内容DIV+CSS实例实验。

DIV+CSS实例二 :
让IE6-IE8显示不同CSS样式效果,DIV CSS代码如下:

<!DOCTYPE 
html>
<html>
<head>
<meta http-equiv="Content-Type" 
content="text/html; charset=utf-8" />
<title>CSS 
IF条件hack实例</title>
<!--[if IE 6]> 
<style 
type="text/css">
.divcss{ 
color:#F00;}
</style>
<![endif]-->
<!--[if IE 7]>

<style type="text/css">
.divcss{ 
color:#FF0;}
</style>
<![endif]-->
<!--[if IE 8]>

<style type="text/css">
.divcss{ 
color:#00F;}
</style>
<![endif]-->

<!--[if IE 9]> 
<style 
type="text/css">
.divcss{ 
color:#000;}
</style>
<![endif]-->
</head>
<body>
<div 
class="divcss">
DIV 
CSS实验提示:<br>
我在IE6下是红颜色,在IE7下是黄颜色,在IE8下是蓝颜色,在IE9下是黑色
</div>
</body>
</html>

最新区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法和Css if hack条件语法操作说明的更多相关文章

  1. 区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法

    HACK原理:不同浏览器对各中字符的识别不同 在 CSS中常用特殊字符识别表: (1)*:  IE6+IE7都能识别*,而标准浏览器FF+IE8是不能识别*的; (2)!important: 除IE6 ...

  2. CSS兼容IE6 IE7 IE8 IE9 Firefox的总结

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 给Select赋值 innerHTML 不兼容IE6\IE7\IE8\IE9

    <select class="b-select" id="location-province" name="Province" def ...

  4. 针对IE6,IE7,IE8,IE9,FF等不同浏览器的CSS写法

    首先我们介绍一下HACK原理,就是不同浏览器对字符的识别不同 在 CSS中常用特殊字符识别表: (1)*: IE6+IE7都能识别*,而标准浏览器FF+IE8是不能识别*的; (2)!importan ...

  5. IE6+IE7+IE8+IE9+FF兼容性调试

    HACK原理:不同浏览器对各中字符的识别不同 (读完文章你会发现,FF和IE8对以下字符的识别能力完全相同) 在 CSS中常用特殊字符识别表: (1)*:  IE6+IE7都能识别*,而标准浏览器FF ...

  6. CSS完美兼容IE6/IE7/IE8/IE9/IE10的通用方法

    关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一.CSS HACK 以下两种方法几乎能解决现今所有HA ...

  7. 一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

    行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10 2012-04-25 16:29:04| 分类: 学习 |字号 订阅 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE ...

  8. [转载]使用兼容ie6 ie7 ie8 FF的text-overflow:ellips

    使用兼容ie6 ie7 ie8 FF的text-overflow:ellipsis超出文本显示省略号来代替截取函数更有利于seo,如果使用截取函数,源代码中的标题是显示不完整的,即便是在title属性 ...

  9. 兼容IE6/IE7/IE8/FireFox的css hack

    兼容IE6/IE7/IE8/FireFox的css hack .color{ background-color: #CC00FF; background-color: #FF00009; *backg ...

随机推荐

  1. iOS 关于UIscrollView

    设置 滚动起始位置 [scrollView setContentOffset:CGPointMake(0, 0) animated:YES];

  2. Windows XP与Windows 7系统常见漏洞

    1.Windows XP系统常见漏洞 Windows XP系统常见的漏洞有UPNP服务漏洞.升级程序漏洞.帮助和支持中心漏洞.压缩文件夹漏洞.服务拒绝漏洞.Windows Media Player漏洞 ...

  3. Java Properties类

    Properties 是哈希表的一个子类.它是用来维持值列表,其中的键是一个字符串,值也是一个字符串. Properties类被许多其他的Java类使用.例如,它是对象通过System.getProp ...

  4. 1. RAID在数据库存储上的应用

    随着单块磁盘在数据安全.性能.容量上呈现出的局限,磁盘阵列(Redundant Arrays of Inexpensive/Independent Disks,RAID)出现了,RAID把多块独立的磁 ...

  5. hdu-5587 Array(回溯)

    题目链接: Array Time Limit: 2000/1000 MS (Java/Others)     Memory Limit: 131072/131072 K (Java/Others) P ...

  6. angular-ui-router state.go not passing data to $stateParams

    app.js中定义了一个state如下,url接收一个id参数 $stateProvider.state("page.details", { url: "/details ...

  7. AspNetPager学习使用1

    今天开始研究使用AspNetPager 首先贴上下载链接:http://www.webdiyer.com/aspnetpager/downloads/ 在下载链接中,作者已经提供了使用方法.在这里,本 ...

  8. MVC4 图片上传

    新增 new { enctype = "multipart/form-data" } 这个必须要有 @using (Html.BeginForm(Html.BeginForm(&q ...

  9. shell中使用echo命令改变输出显示样式

    文本终端的颜色可以使用“ANSI非常规字符序列”来生成.举例:echo -e "\033[44;37;5m ME \033[0m COOL" 以上命令设置背景成为蓝色,前景白色,闪 ...

  10. markdownpad2使用说明

    ## 欢迎使用 MarkdownPad 2 ## **MarkdownPad** 是 Windows 平台上一个功能完善的 Markdown 编辑器. ### 专为 Markdown 打造 ### 提 ...