烦人的IE兼容今天给予完整的解答

做网站的时候烦人的就是IE的不兼容,这也害苦了不知道多少的编码师。今天海口网络公司易优小陆就为大家特地的讲解一下网站的兼容如何的解决。
特别是对完全使用DIV+CSS设计的网页,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网页可能乱的一塌糊涂!我经常被这些东西整的焦头烂额,于是呼在网上找了些资料,加上自己的理解和这些日子的经验,整理了一些资料,其中有一些我还没用到的和还不能理解的,就直接从别的地方给粘了过来,不知道有没有错误,等我以后用到的时候慢慢改吧,希望对大家有点帮助!    什么是浏览器兼容:当我们使用不同的浏览器(Firefox IE7 IE6)访问同一个网站,或者页面的时候,会出现一些不兼容的问题,在这种浏览器下显示正常,在另一种下就乱了,我们在编写CSS的时候会很恼火,刚修复了这个浏览器的问题,结果另外一个浏览器却出了新问题。important (功能有限)
随着IE7对!important的支持, !important 方法现在只针对IE6的兼容.(注意写法.记得该声明位置需要提前.)
例如:
#example {
width: 100px !important; /* IE7+FF */
width: 200px; /* IE6 */
}
二、CSS HACK的方法(新手可以看看,高手就当路过吧)
首先需要知道的是:
所有浏览器 通用 height: 100px;
IE6 专用 _height: 100px;
IE7 专用 *+height: 100px;
IE6、IE7 共用 *height: 100px;
IE7、FF 共用 height: 100px !important;
例如:
#example { height:100px; } /* FF */
* html #example { height:200px; } /* IE6 */
*+html #example { height:300px; } /* IE7 */
下面的这种方法比较简单
举几个例子:
1、IE6 - IE7+FF
#example {
height:100px; /* FF+IE7 */
_height:200px; /* IE6 */
}
其实这个用上面说的第一种方法也可以
#example {
height:100px !important; /* FF+IE7 */
height:200px; /* IE6 */
}
2、IE6+IE7 - FF
#example {
height:100px; /* FF */
*height:200px; /* IE6+IE7 */
}
3、IE6+FF - IE7
#example {
height:100px; /* IE6+FF */
*+height:200px; /* IE7 */
}
4、IE6 IE7 FF 各不相同
#example {
height:100px; /* FF */
_height:200px; /* IE6 */
*+height:300px; /* IE7 */
}
或:
#example {
height:100px; /* FF */
*height:300px; /* IE7 */
_height:200px; /* IE6 */
}
需要注意的是,代码的顺序一定不能颠倒了,要不又前功尽弃了。因为浏览器在解释程序的时候,如果重名的话,会用后面的覆盖前面的,就象给变量赋值一个道理,所以我们把通用的放前面,越专用的越放后面
解释一下4的代码:
读代码的时候,第一行height:100px; 大家都通用,IE6 IE7 FF 都显示100px
到了第二行*height:300px; FF不认识这个属性,IE6 IE7都认,所以FF还显示100px,而IE6 IE7把第一行得到的height属性给覆盖了,都显示300px
到了第三行_height:200px;只有IE6认识,所以IE6就又覆盖了在第二行得到的height,显示200px
这样,三个浏览器都有自己的height属性了,各玩各的去吧
这样说要是你还不明白,要么你去撞墙,要么我去!不过还是你去比较好。
哦,差点忘了说了:
*+html 对IE7的兼容 必须保证HTML顶部。

原文地址:http://blog.51cto.com/jeecool/2312118

时间: 2024-10-17 07:46:15

烦人的IE兼容今天给予完整的解答的相关文章

病毒&烦人的幻灯片

<病毒>传送门 <烦人的幻灯片>传送门 病毒 描述 有一天,小y突然发现自己的计算机感染了一种病毒!还好,小y发现这种病毒很弱,只是会把文档中的所有字母替换成其它字母,但并不改变顺序,也不会增加和删除字母. 现在怎么恢复原来的文档呢!小y很聪明,他在其他没有感染病毒的机器上,生成了一个由若干单词构成的字典,字典中的单词是按照字母顺序排列的,他把这个文件拷贝到自己的机器里,故意让它感染上病毒,他想利用这个字典文件原来的有序性,找到病毒替换字母的规律,再用来恢复其它文档. 现在你的任务

VIJOS PID221 / 烦人的幻灯片

 暴力出奇迹,古人诚不欺我. PID221 / 烦人的幻灯片 2017-04-14 19:47:08 运行耗时:30 ms 运行内存:12292 KB 查看最后一次评测记录 题目描述 李教授于今天下午做一个非常重要的演讲.不幸的是他不是一个非常爱整洁的人,他把自己做演讲要用的幻灯片随便堆放在一起.因此,演讲之前他不得不去整理这些幻灯片.做为一个讲求效率的学者,他希望尽可能简单地完成它.情况是这样,教授这次演讲一共要用n张幻灯片(n<=26),这n张幻灯片按照演讲要使用的顺序已经用数字1,2,-,

4735 烦人的幻灯片 (拓扑)

4735 烦人的幻灯片 时间限制: 2 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题目描述 Description 帅气的作者将于今天下午作一次非常重要的演讲.不幸的是他不是一个非常爱整洁的人,他把自己演讲要用的幻灯片随便堆在了一起.因此,演讲之前他不得不去整理这些幻灯片.作为一个讲求效率的oier,他希望尽可能简单地完成它.帅气的作者这次演讲一共要用n张幻灯片(n<=26),这n张幻灯片按照演讲要使用的顺序已经用数字1~n编了号.因为幻灯片是透明的,所以我们不能一下子看

去除下载文件属性中烦人的锁定状态

我们用浏览器下载文件的时候,往往会附加一个锁定的状态,执行些被锁定的文时,会出现一个安全警告框. 要去除这个安全警告,必须在右键的属性选项中点击"解除锁定"的按钮: 虽然这个是为了安全考虑,但是很多时候还是觉得非常烦人的.之前在网上找了个注册表可以去掉这个自动锁定的功能,但最近重装系统后,发现这个烦人的特性又回来了.便再次搜索了一下,发现园子里有篇文章介绍得比较详细:Windows沙拉:为什么下载的文件打开时会有警告,而且会被"锁定"? 该文章也介绍了两种解决的方法

使用call、apply和bind解决js中烦人的this,事件绑定时的this和传参问题

1.什么是this 在JavaScript中this可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式,this 绑定的对象即函数执行的上下文环境(context). 为了帮助理解,让我们来一起看一段代码: // 作为对象方法调用 var test = { a : 5, b : 6, sum : function () { return this.a + this.b; // 此处this = test } } alert(test.sum()); // 11 作为对象调用时thi

centos7常见问题-解决烦人的声音

1.关闭Linux下Shell终端嘟嘟声和vi中错误提醒的Beep音 If you are using bash echo $0 vi /etc/inputrc set bell-style none 取消注释(取消蜂鸣音) 取消在vi错误提示音 rmmod pcspkr  ---临时关闭  modprobe pcspkr  --临时开启 永久 vi ~/.bashrc setterm –blength 0 #xset –b 保存重启永久生效.烦人的声音就没有了. ~~~~~~~~~~~~~~~

拓扑排序——烦人的幻灯片

烦人的幻灯片 Description 李教授于今天下午做一个非常重要的演讲.不幸的是他不是一个非常爱整洁的人,他把自己做演讲要用的幻灯片随便堆放在一起.因此,演讲之前他不得不去整理这些幻灯片.做为一个讲求效率的学者,他希望尽可能简单地完成它.情况是这样,教授这次演讲一共要用n张幻灯片(n<=26),这n张幻灯片按照演讲要使用的顺序已经用数字1,2,…,n在上面编上了号.因为幻灯片是透明的,所以我们不能一下子看清每一个数字所对应的幻灯片.现在我们用大写字母A,B,C,...再次把幻灯片依次编上号,

SID1190471 / 烦人的幻灯片 暴力出奇迹 !!!!!!!!!!!!!!!!!!

PID221 / 烦人的幻灯片 ☆ 提交你的代码 查看讨论和题解 你还木有做过哦 我的状态 查看最后一次评测记录 质量还不能统计出来哦~ 题目评价 质量 无 ★★★★★ ★★★★☆ ★★★☆☆ ★★☆☆☆ ★☆☆☆☆ 0% 0% 0% 0% 0% ★ ★ ★ ★ ☆ 通过人数 186 / 337 通过统计 最短耗时 0ms 最小内存 0KB 其它 题目标签 类型 其它 题目描述 李教授于今天下午做一个非常重要的演讲.不幸的是他不是一个非常爱整洁的人,他把自己做演讲要用的幻灯片随便堆放在一起.因此

2015 湘潭大学程序设计比赛(Internet)--E题--烦人的异或

烦人的异或 Accepted : 27   Submit : 102 Time Limit : 5000 MS   Memory Limit : 65536 KB 题目描述 如下图,有一N*M的表格,每个格子有一个数字.我们定义主矩形为给出的一对坐标所确定的矩形(该对坐标总是某个矩形的对顶点坐标对).它最多可产生4个副矩形, 均由主矩形的顶点和表格边界确定.我们需要的是所有阴影部分的数的异或值. 上图的x1=3,y1=3,x2=4,y2=4,所以答案就是a11^a12^a21^a22^a15^a