如何将h2标签内图片设为块元素使文本换行（无法修改HTML）

遇到这种不能修改HTML只能靠CSS调整的情况，问题出在<img>标签的align="left"属性上——这个旧属性会给图片加上float: left的效果，光设置display: block是冲不掉浮动的，所以文本还是会跟在图片旁边。

你可以用以下CSS代码来实现需求：

h2 img.left {
  float: none; /* 先清除align="left"带来的浮动效果 */
  display: block; /* 让图片独占一行，迫使文本换行到下一行 */
  width: auto; /* 明确设置图片宽度自动，符合你的要求 */
}

原理说明：

• float: none：覆盖align="left"默认的浮动行为，让图片不再向左浮动
• display: block：把图片变成块级元素，占据整行空间，后面的文本自然就会换行到下一行
• width: auto：确保图片保持原始宽高比例，不会被拉伸或压缩

这样设置之后，文本就会乖乖跑到图片的下一行啦！

内容的提问来源于stack exchange，提问作者Gotoinc