css 图片按比例缩放

HTML结构是这样的,外面一个div,里面放个img标签

    <div>
      <img src="" alt="">
    </div>
  div {
    width: 100px;
    height: 100px;
    overflow: hidden;
  }
  img {
    max-width:300px;
    width:expression(this.width > 300 ? "300px" : this.width);
  }

expression是在IE5版本之后支持使用的,用来把CSS属性和Javascript脚本关联起来,【这里的CSS属性可以是元素固有的属性,也可以是自定义属性。】是动态设置CSS属性的强大方法,但也存在着一定的危险性。 

CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。

在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。

猜你喜欢

转载自blog.csdn.net/Hero_rong/article/details/105784235
今日推荐