假设一张 300x250 的图片,放在600px的div内,如何用css把图片拉伸到 600x600
<div style="width:600px">
<img src="#" style="width:100%;height:?"/>
</div>
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。
纯CSS应该不可以吧
js方法:
;(function($){
$(function(){
var $divWidth = $('xxx').width();
$('img').css({'height':$divWidth});
})
})(jQuery)
css3里面有一个calc的动态计算方法,不过好像只能计算一个属性的值,即高只能计算高,宽只能计算宽,高度不能去获取宽度的值并计算。所以这样对你这个需求也无法满足。
不过你也在先手动计算了div的宽高比,然后再使用高度,就比如:
假如div宽度是600px,高度是500px,那么宽/高是1.2,那就可以设置css属性
div{
width:600px;
height:500px;
overflow: hidden;
}
img{
width:100%;
height:120%;
}
评论
全部评论 (0)