标签 [ 兼容 ] 下的文章

两段兼容的控制图片宽度/高度的CSS代码

简单是max-width:就可完成图片最大宽度得限制,但是由于ie6不支持max-width只能通过expression来实现。
下面两段代码效果是一样的,我用的没问题,具体特色大家自行测试。第三段对高度同时做了限制。

代码如下:

img {max-width:400px; scale:expression((this.offsetWidth > this.offsetHeight)?(this.style.width = this.offsetWidth >= 400 ? "400px" : "auto"):"auto"); display:inline !important;}
.img{ 
max-width: 200px; 
height:auto; 
width:expression(this.width > 200 ? "200px" : this.width); 
}


第三段对高度同时做了限制。

.img{
max-width:201px; 
max-height:136px;
width:expression(this.width > 201 && this.width > this.height ? '201' : auto);
height: expression(this.height > 136 ? '136' : auto);
}


针对firefox ie6 ie7的css样式

现在我们大部分都是用!important来hack,对于ie6和firefox测试可以正常显示,但是ie7对!important可以正确解释,会导致页面没按要求显示!搜索了一下,找到一个针对IE7不错的hack方式就是使用“*+html”,现在用IE7浏览一下,应该没有问题了。

现在写一个CSS可以参照如下定义:

#menu { padding-right: 150px }/* Moz */
* html #menu { padding-right: 50px; } /* IE6 */
*+html #menu { padding-right: 150px; }/* IE7*/



好多说看不懂,我·#%¥¥%(希望大家多到网上看看CSS的一些教程)

More »

最新文章

最近回复

链接