mtwm.net
当前位置:首页 >> 如何让图片适应Div大小 >>

如何让图片适应Div大小

让图片自动适应DIV容器大小: 这一现象很常见,其实,只须将DIV的大小设置成为固定的大小.设定img 的宽度为:100%;高度为:100%;即可让图片自动适应DIV容器的大小.

先给div定义overflow:hidden样式,不是为了剪裁图片,只是为了页面加载的时候,图片不会把div撑开,让页面布局被破坏,然后给所有需要自适应的图片,定义一个相同的name属性,然后在页面onload事件,或者页面最后调用一个脚本,获取

样式这样写:.xxxDiv { background: #000 url("images/xxx.png") no-repeat scroll center center; background-size: 100% 100%;}HTML 例子:哈哈哈

<img>中加个onload 事件 然后在事件里面设置div的大小

对背景图片设置属性:background-size:cover;可以实现背景图片适应div的大小.background-size有3个属性:auto:当使用该属性的时候,背景图片将保持100% 的大小显示,不进行任何缩放.超过div的多余部分将被隐藏.当图片过小时,图

你好!其实DIV的宽高要适应于图片的大小,那最好的办法就是不在要div里加入任何的CSS高度和宽度,如果你DIV两边还有内容的话,直接加入一个float就够了,至于宽高都改成auto或为空就行.下面我举个例子,两边分别有DIV,中间放置图

给div加个样式 然后把div设置成固定大小 添加图片的时候div就不会变了

像你这么说,貌似只有用js来判断了,首先给图片上下左右居中,给父级元素设置overflow:hidden;然后用过js来获取当前图片的宽高,如果宽度大于高度,那么就高度为100%,宽度自适应,反之宽度100%,高度自适应;

自适应?那就把背景图片平铺显示了如果想div变大图片也变大,用背景图片(background-image)是做不到的

给图片的宽度给一个百分比就可以了

网站首页 | 网站地图
All rights reserved Powered by www.mtwm.net
copyright ©right 2010-2021。
内容来自网络,如有侵犯请联系客服。zhit325@qq.com