如何在 Safari 阅读器中的每个图像后强制换行？答案

【问题标题】：How to force a line break after each image in Safari Reader?如何在 Safari 阅读器中的每个图像后强制换行？
【发布时间】：2020-06-26 22:44:28
【问题描述】：

我无法在本地 HTML 文件中激活 Safari 阅读器，所以我不能给你一个运行示例，只能描述我的问题：

我的博客文章的标记基本上是这样的：

<div class="post">
 <div class="post-header">Hello, World</div>
 <div class="post-body">
  <p>Look at this picture:</p>
  <p><img src="http://37prime.com/news/wp-content/uploads/2008/03/safari_icon.png"/></p>
  <p>Isn't that a nice picture?</p>
 </div>
</div>

这在所有浏览器中都符合预期，包括 Safari。然而，在 Safari 阅读器中，第三段“这不是一张漂亮的照片吗？”漂浮在图像周围，而不是在它自己的段落上。

有人遇到过类似的问题吗？

【问题讨论】：

我暂时忽略了这个问题（遗憾的是，你的建议对我没有用），只是出于好奇在 Safari 阅读器中再次尝试了它。由于某种原因，该问题不再发生了。同时，我对我的 CSS 做了几处更改，所以我原来的 CSS 可能导致了问题（或者它是 Safari 中的一个错误，我没有注意到它会自行更新）。

标签： html safari

【解决方案1】：

不要只使用<br />，而是使用<br clear="all" />。

【讨论】：

哇。不错的物业

【解决方案2】：

.post-body img {
  display: block;
}

应该可以解决问题。

【讨论】：

【解决方案3】：

<img src='ImagePath' alt="not found" style="display:block">

【讨论】：

【解决方案4】：

在每行的末尾/之后使用<br/> 标签

【讨论】：

查看我对 Taylor Satula 回答的评论。简而言之：它不起作用。

【解决方案5】：

是的，您可以尝试在“图片：”之后添加
换行符我无法验证它是否有效，但理论上它可以通过使用仅为换行符制作的标签来解决问题（减少重新设置样式的机会）

【讨论】：

当我插入
时，出于某种原因，Safari 阅读器不再识别该文章。无论如何，无论如何我都不能轻易地在每张图片后面放一个
：文章是通过 Textile 标记的，并且换行符必须由每个作者明确设置。
正如@fhd 已经提到的，它不起作用。此外，添加一个您尚未验证的答案对网站及其用户没有多大用处，除非问题是关于理论方法（正如您提到的那样）。