首页 新闻 会员 周边 捐助

如何通过css让图片宽度不超过图片所在div的宽度

0
悬赏园豆:30 [待解决问题]

也就是不让图片撑开页面。

由于页面宽度是自适应屏幕的,div的宽度不是固定的,用max-width实现不了。

css
dudu的主页 dudu | 高人七级 | 园豆:31030
提问于:2016-07-15 12:17
< >
分享
所有回答(4)
0

图片设置为div的背景图片。

czd890 | 园豆:14482 (专家六级) | 2016-07-15 12:19
0

width:100%; 再用max-width

宁馨儿11 | 园豆:182 (初学一级) | 2016-07-15 12:26

如果图片的实际宽度小于div的宽度,就用图片的实际宽度

支持(0) 反对(0) dudu | 园豆:31030 (高人七级) | 2016-07-15 13:05

@dudu: 图片宽度小于div宽度,img:width:100%;max-width:图片的宽度; div也要给宽度,这样图片的宽度100%,才会有效

支持(0) 反对(0) 宁馨儿11 | 园豆:182 (初学一级) | 2016-07-15 13:20

@宁馨儿11: 如果图片宽度是100px,div宽度是200px,原封不动;如果图片宽度是300px,div宽度是200px,图片宽度用200px。

支持(0) 反对(0) dudu | 园豆:31030 (高人七级) | 2016-07-15 13:29

@dudu: 如果是用于电脑端,img:width:200px;如果是用于手机端,图片的父类div给宽度,图片本身:width:100%,max-width:200px;

支持(0) 反对(0) 宁馨儿11 | 园豆:182 (初学一级) | 2016-07-15 13:49
0

设置图片的宽和高继承父级div应该可以吧

CodeHsu | 园豆:5668 (大侠五级) | 2016-07-15 13:17
0
img {
  display: block;
  height: auto;
  max-width: 100%;
}

这样就行了

by.Genesis | 园豆:2824 (老鸟四级) | 2016-07-15 13:37

100%会撑开页面

支持(0) 反对(0) dudu | 园豆:31030 (高人七级) | 2016-07-15 13:46

@dudu: 直接上代码吧

支持(0) 反对(0) by.Genesis | 园豆:2824 (老鸟四级) | 2016-07-15 14:44

@唯利是图: 比如这篇博文中的图片:http://www.cnblogs.com/zhaoqingqing/p/5668225.html

支持(0) 反对(0) dudu | 园豆:31030 (高人七级) | 2016-07-15 15:18
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册