怎么让图片在不同的设备上进行自适应

慕粉1472350037
浏览 5716回答 19
19回答

oldfu

1.图片样式img{max-width:100%;height:auto;display:block}2.创建新元素<picture alt="image description">   <source src="/path/to/medium-image.png" media="(min-width: 600px)">   <source src="/path/to/large-image.png" media="(min-width: 800px)">   <img src="/path/to/mobile-image.png" alt="image description"> </picture>

灰灰灰灰灰灰灰

img{width:100%} .img{width:50%}<div class="img"><img src=""/> </div>利用外面包裹的div去控制图片的大小。外面的div可以使用不同的方式去控制。比如rem布局,或者vw,vh布局去编写,这样就可以自适应布局。

cnyballk

百分比写法或者使用媒体查询

成都加米谷大数据

 用 百分比方法,简单实用

疯狂的小蜗牛

设置width:100%; height:auto; 或者套用框架布局

A空城

<style> .divimg img{ width:100%; height:auto;} </style> <div class='divimg'><img src='../images/123.jpg'></div>以上是代码,直接套用就好

ke__ke

百分比最简单
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

CSS3
Html5