css样式兼容不同浏览器有关问题

css样式兼容不同浏览器问题

}/* */

IE5/MAC的过滤器，一般用不着
/**//*/
@import "ie5mac.css";
/**/

下面是IE的条件注释，个人觉得用条件注释调用相应 兼容是比较完美的多浏览器兼容的解决办法。把需要兼容的地方单独放到一个文件里面，当浏览器版本符合的时候就可以调用那个被兼容的样式，这样不仅使用起来 非常方便，而且对于制作这个CSS本身来讲，可以更严格的观察到是否有必要使用兼容，很多情况下，当我本人写CSS如果把全部代码包括兼容都写到一个 CSS文件的时候的时候会很随意，想怎么兼容就怎么兼容，而你独立出来写的时候，你就会不自觉的考虑是否有必要兼容，是先兼容 CSS？还是先把主CSS里面的东西调整到尽可能的不需要兼容？当你仅用很少的兼容就让很多浏览器很乖很听话的时候，你是不是很有成就感呢？你知道怎么选 择了吧～～呵呵

}/* */

IE5/MAC的过滤器，一般用不着
/**//*/
@import "ie5mac.css";
/**/

下面是IE的条件注释，个人觉得用条件注释调用相应 兼容是比较完美的多浏览器兼容的解决办法。把需要兼容的地方单独放到一个文件里面，当浏览器版本符合的时候就可以调用那个被兼容的样式，这样不仅使用起来 非常方便，而且对于制作这个CSS本身来讲，可以更严格的观察到是否有必要使用兼容，很多情况下，当我本人写CSS如果把全部代码包括兼容都写到一个 CSS文件的时候的时候会很随意，想怎么兼容就怎么兼容，而你独立出来写的时候，你就会不自觉的考虑是否有必要兼容，是先兼容 CSS？还是先把主CSS里面的东西调整到尽可能的不需要兼容？当你仅用很少的兼容就让很多浏览器很乖很听话的时候，你是不是很有成就感呢？你知道怎么选 择了吧～～呵呵

IE的if条件兼容 自己可以灵活使用参看这篇IE条件注释
Only IE
所有的IE可识别

只有IE5.0可以识别
Only IE 5.0+
IE5.0包换IE5.5都可以识别

仅IE6可识别
Only IE 7/-
IE6以及IE6以下的IE5.x都可识别
Only IE 7/-
仅IE7可识别





Css 当中有许多的东西不不按照某些规律来的话，会让你很心烦，虽然你可以通过很多的兼容，很多的!important 来控制它，但是你会发现长此以往你会很不甘心，看看许多优秀的网站，他们的CSS让IE6,Ie7,Firefox,甚至Safari,Opera运行起 来完美无缺是不是很羡慕？而他们看似复杂的模版下面使用的兼容少得可怜。其实你要知道IE 和 Firefox 并不不是那么的不和谐，我们找到一定的方法，是完全可以让他们和谐共处的。不要你认为发现了兼容的办法，你就掌握了一切，我们并不是兼容的奴隶。

CSS教程:overflow与text-indent:-9999px

作为一个web前端开发
为了html语义化
常常要给内容模块加上一些标题来让页面更有意义
当然还有我们的图片按钮
在抛开css裸奔的情况下也能很顺利的汲取到页面信息
通常为了传达更好的视觉效果
我们常用图片替代掉字体
而早前的前端开发常直接不在html中给出内容
用 ；（甚至为空）
这样在没有加载到css时就无法知道这个区块究竟是什么内容了

正题开始
通常偏移掉字体的方式是
使用text-indent:-9999px;
可是他有一个局限性 他只适用于块级元素block
而我们往往有时候想偏移掉的a上的字体
所以问题就来了
text-indent:-9999px;虽然用起来比较惬意
将a转化成block的话 往往 他身后的的元素就被他赶到下一行了
如果正好这个a后面 是一个a按钮
就要用float来浮动以使他身后再出现簇拥者

这样是不是有些麻烦呢
所以推荐使用
line-height:0;
font-size:0;
overflow:hidden;
能完美“隐藏”掉你background之上的字体
经测试 ie6.0 、 7.0 、8.0、firefox 3.010 通过

而针对input value的隐藏这个方式就有些吃力了
所以还是只能用block加text-indent来“偏移”模拟隐藏了
display:block;
font-size:0;
line-height:0;
text-indent:-9999px;
经测试 ie6.0 、 7.0 、firefox 3.010 通过

?