作者santin (被雷劈)
看板Web_Design
标题Re: CSS排版,IE跟FF的问题...
时间Sun Oct 8 15:24:36 2006
※ 引述《godisempty (justlikeme)》之铭言：
: 小弟我是CSS初学者
: 用CSS排动态网站
: 可是IE排完了, Firefox又完全跑掉
: 两个都不能相同显示 = ="
: 这两者该怎麽做才会正常显示呢?
我也是CSS新手= =a
不过有些问题也有遇过
主要是因为IE有很多BUG
像是Doubled Float-Margin Bug
当你对几个物件设定float:left; margin-left:20px;
这样理论上来说应该是每个被float的物件都间隔20px
但是在IE上最左边的却会变成40px
诸如此类的bug很多~"~
所以建议贴上网址让大家看看哪些地方的写法可能会造成IE的问题
再一个一个解决
至於楼下的IE Hack
也可以说是CSS Hack
我是觉得搞懂问题的原因再使用比较好:)
通常我会写成这样↓
left:100px;
*left:103px;
因为加上*号要是要暂时标记比较好改XD
/*left:103px;*/
这个原理是利用IE会将*left视为写错字，很贴心(?)的照样当做正确的读取
但是符合标准的浏览器是不会去读取那一行的(无效的选择器名称)
就会变成
left:100px; →firefox读取
*left:103px; →IE读取
忘了说
楼下推文还有一个是html>body #index1这种写法
也是利用IE的特性
假设写成
#index1 {
width:100px;
height:100px;
background:#ff0;
}
html>body #index1 {
background:#fff;
width:100px;
height:100px;
}
那麽IE只会读取上面那个CSS
而html>body #index1则会被IE以外的浏览器读取
显示出来的是IE看到黄色方块，其他的浏览器看到白色方块
可以试试看:)
※ 编辑: santin 来自: 61.229.111.56 (10/08 15:35)
1F：推 elan:推"搞懂问题的原因再使用比较好" 10/11 23:15
2F：→ elan:补充一点看法:用child-selector来避免IE读取并不是IE的'特性' 10/11 23:16
3F：→ elan:那是因为IE6之前不支援此规格,严格来说根本不是'hack' 10/11 23:19
4F：→ elan:从正确的设计观点上,尽量不要利用UA的CSS支援度来修正特定UA 10/11 23:22
5F：→ elan:的rendering bugs 10/11 23:24