Tagged: css

IE6中关于max-width、max-height以及PNG图片透明的一些hack技巧 3

IE6中关于max-width、max-height以及PNG图片透明的一些hack技巧

最近做网站的时候,又遇到了许多关于IE6方面头疼的事情。原来遇到min-width以及min-height的时候,可以通过!important来解决;不过这次又有了新的问题,max标签以及png图像透明的问题浮现了出来。 搜索了一下网络,得到了一些如何处理这些问题的方法,记录下来。 区别不同浏览器,CSS hack写法: 区别IE6与FF:        background:orange;*background:blue; 区别IE6与IE7:        background:green !important;background:blue; 区别IE7与FF:        background:orange; *background:green; 区别FF,IE7IE6:        background:orange;*background:green !important;*background:blue; 注:IE都能识别*;标准浏览器(如FF)不能识别*; IE6能识别*,但不能识别 !impo­r­tant, IE7能识别*,也能识别!important; FF不能识别*,但能识别!important;   IE6 IE7 FF * √ √ × !impo­r­tant ×…

在IE6里准确显示较小高度的DIV层 1

在IE6里准确显示较小高度的DIV层

在做网页设计的时候,尤其是给咱们国内做网站,一定要考虑到兼容性的问题。Firefox、Chrome、Safari、IE8这类对于CSS标准支持的比较好的网站,基本上测试一种就差不多行了(一些Javascript除外)。但是对于IE6、IE7这两个浏览器,要区别对待。特别是IE6,支持CSS一点都不好,自己说了算,但是在国内却有数量庞大的电脑依然在使用IE6浏览器。我想这与安装了盗版XP并禁用了自动更新功能有关吧。 转到今天的主要话题。在给一个朋友做网站的时候,发现有个小问题。在我定义的一个div层中,只有一条横线,高度为4px。在IE8、Firefox、Chrome中均显示正确,但是在IE6中却显示出了三条线,而这个div的高度也增加为15px。于是我将高度设成10px,依然不见效,但是设置成30px的时候,高度就增加出来了。这说明这个div盒子里面并不是空的,尽管我在<div></div>中间连一个空格也没有。 没错,这就是字体虚占位了。IE6默认按照字体大小min-height了一下这个div层,才会出现如此的问题。所以我们将计就计,把字体大小设成0不就好了?再加上一个overflow的hidden,一切就完美了。 建议定义一个css的class来处理这类的问题,我是这么干的: .miniboxhack{font-size:0; overflow:hidden;} 问题解决了。

解决IE6、IE7在CSS中设置最小高度遇到的问题 0

解决IE6、IE7在CSS中设置最小高度遇到的问题

在开发一个某公司的网页界面时,遇到了这样的问题:当设置某一个区域的最小高度为某个值的时候,在Firefox、IE6以及IE7中的表现并不一样。如果只是设定了min-height值,那么在IE6中不能识别;但设定了height值,在IE7和Firefox中,位置就会固定了。这是一个很大的问题。那么为了协调各个浏览器和各个版本,我们怎样做才能解决最小高度的问题呢? 我在网络上寻找了一些相关资料,有一种解决方法比较好: .distan­ce { height:auto!important; height:100px; min-height:100px; } !import(优先)标签在IE6中并不认识,所以在IE6中上述代码会被理解成为: height:100px; min-height:100px; 而在IE7中则是: height:auto; min-height:100px; 在这里,我们所利用的特性是: IE6不能识别 !impo­r­tant 标签; IE6不能识别 min-hei­g­ht 标签; IE6中的高度(height)标签的最终效果等同于IE7与Firefox浏览器中的最小高度(min-height)标签; 最终便可以解决上述问题。