手机端响应式布局时，图片设置width=100%后，还有设置display：block才能实现自适应？_问答_优艾设计网

手机端响应式布局时，图片设置width=100%后，还有设置display：block才能实现自适应？

优艾设计网 https://www.uibq.com 2023-02-22 07:47 出处：网络作者：PS抠图

求解 <!DOCTYPE html> <html lang=\"zh-cn\"> <head> <meta charset=\"UTF-8\"> <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum

求解

<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0,user-scalable=no"> <title优艾设计网_平面设计>移动端</title> <style> img {display: block; max-width: 100%; } </style> </head> <body><img src="img/tour1.jpg" alt=""></body> </html>

喜来力疏清浅你曾走过我的故事天 10小时前

优艾设计网_PS问答

img标签是行内元素，行内元素是没有width和height属性，自然无法设置。需要设置成block，才可以设置。但是img标签比较特殊，跟input又叫替换元素，自身就有width和height，所有只是为了设置width和height，改变display为block是没有必要的。画蛇添足而已

西西西宝优艾设计网_Photoshop百科 10小时前

解决图片常见问题---底部多余留白

鬼迷了优艾设计网_平面设计心窍坐看云海把昨日还给我 10小时前

display:block;

mimi2222 优艾设计网_PS交流 10小时前

因为img标签默认是行内元素（好像是这么说的），也就是inline，行内元素设置宽度是无效的，display: block; 之后为块级元素。设置了width才有效

QXKTY 优艾设计网_设计模板 10小时前

为何不用flex布局呢?

才放你走优艾设计网_Photoshop论坛 10小时前