CSS实现图片超过限定尺寸自动缩放兼容IE和Firefox

来源:互联网 发布:淘宝网上怎么买处方药 编辑:程序博客网 时间:2024/06/14 21:20

    对于做网站的同志们来说,有一个东西很简单,也很必要,比如在文章里插入图片,如果图片大小合适倒没什么,但要是尺寸超过了文章区域的宽度,就会出汗了...那么如何才能控制图片的大小呢?当然我们可以直接用JS,但这样未免有些麻烦,CSS中的expression()给我们提供了一个捷径.

    只用一行代码,我们即可实现轻松控制图片大小:

img{ width: expression( ( this.width > 300) ? 300 : this.width ); }

    这样一来,图片的宽就被限制在了300以内.不过FireFox可不吃这套...但是更简单,只需要加一个max-width即可,综合起来写法如下:

img
{
    max-width: 200px;
    width: expression( ( this.width > 300) ? 300 : this.width );
}

    这样,一个兼容IE与FF(Firefox)的图片自动缩放的CSS就搞定了!是不是很简单哈?

原创粉丝点击