Question

css响应式问题，图片随页面宽度等比例缩小该怎么设置

css响应式问题，图片随页面宽度等比例缩小该怎么设置图片是在一个一个的div里的





Answer 1

手机响应式布局，是获取屏幕尺寸，在某个区间用一种css，另个区间用另一种css。需要用@media写多份css的。无法做到真正的随屏幕变化而变化。而的用法是随着屏幕的大小，自动把页面自适应到屏幕的大小。这个是管用的。em是字体的宽度，也就是一个字体宽12px，那么em=12px；字体为15px，em=15px；一般用来动态控制字体外的区块大小去适应字体，而不是用来设置字体的大小的。例如： 如果没效果，建议你用图片贴出来，看看你想要的具体效果是什么。

追问

就是图片随窗口缩小而缩小

Answer 2

@media(min-width:1200px){
img{width:25%;
box-sizing:border-box;
padding:10px;
}
}
@media(min-width:800px){

}
@media(min-width:480px){

}
@media(max-width:480px){

}
在里边写上你对应的样式，类似于我第一个写的那样，把你对应的样式写上去，但是我写的跟你效果图不一样，只是为了表明意思所以没细写，因为你已经知道尺寸了所以宽度可以用固定尺寸写，计算好就行

Answer 3

设置DIV的宽度百分比变化，把DIV里嵌套的img的宽度设置成100%就好了