继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

响应式布局的图片设置

李狗带
关注TA
已关注
手记 4
粉丝 13
获赞 497

@media screen and (min-width: 1001px){
figure{ width: 33.3%}

}
/当屏幕大于1001px时 每张图片占据整张屏幕的33.33%/
@media screen and (min-width: 601px)and (max-width: 1000px){
figure{ width: 50%}

}
/当屏幕大于601px小于1000px时 每张图片占据整张屏幕的50%/
@media screen and (min-width: 400px ) and (max-width: 600px){
figure{ width: 100%}
}
/当屏幕大于400px小于600px时 每张图片占据整张屏幕的33.33%/

打开App,阅读手记
4人推荐
发表评论
随时随地看视频慕课网APP

热门评论

大于1001px,应该改为大于等于1001px。

其它地方也得修改一下。

查看全部评论