移动版图片宽 1200px 撑破布局被判不适配

先看现象。正文图片固定输出 1200px 宽，移动端容器只有 360px，整页可以左右拖动。移动适配检测判超出视口，体验分被扣，用户也抱怨看不全。

把日志和配置对完，能解释这个现象的基本就这几处。图片标签只写宽度属性，没有最大宽度限制。还有一种是编辑器插入的图片自带固定宽度。

少数情况下是媒体查询没有覆盖正文里的图片。

不容易想到的是，老文章图片是富文本内联样式。

动手时先看页面图片的宽度属性

curl -s https://m.example.com/post/1 | grep -o 'width="[0-9]*"' | head

给正文图片加自适应规则

img { max-width: 100%; height: auto; }

批量清掉正文里的内联宽度

UPDATE posts SET content = REGEXP_REPLACE(content, 'width="[0-9]+"', '') WHERE id > 0;

真

机

改完先别撤，确认这几项。改完后移动端不再横向滚动，图片按容器等比缩放，适配检测的超宽提示消失，跳出率降了一成。

容易忽略的是，只加最大宽度就够，别用固定宽度去覆盖，否则大屏上图片会被放大得发糊。监控比日志更早给出信号，事后回看经常能提前半小时发现异常。