如何在中间显示文字？

Question

我想在屏幕中间显示文章的文字，但要保持图片大小。我正在使用Wordpress，因此我可以添加自定义CSS。

我该怎么做？填充或添加边距不起作用，因为它还将其添加到图像中。由于我使用Wordpress，这似乎更难。图像会自动包含在article-body标签中以及段落标签中。我该怎么办？您可以在下面的屏幕截图中看到文本，这是来自medium.com的中间，因为它非常酷且易于阅读，但同时图像非常大且比文本大。我无法在我的wordpress网站上这样做。

添加填充或边距会影响图像。对齐中心不起作用。

Answer 1

试试这个：

text-align:center;
margin: auto 0;

<强>更新

将.body-text替换为以下内容：

.body-text {
    margin-bottom: 30px;
    width: 90%;
    margin-top: 30px;
    margin: 0 auto;
    text-align: center;

如果您想将文本居中，请删除text-align：center;作为段落中的instyle如此：

<p id="6d1a" class="graf--p">

缩小宽度会改变图像的宽度，所以在图像之前结束正文文字，如下所示：

  <div class="body-text clearfix" itemprop="articleBody">

      <p id="6d1a" class="graf--p" style="/* text-align: left; */">
The U.S. national security space communit.....</p>
    </div>

然后将图像放在正文div之外。

然后在正文中包含段落，如下所示：

 <div class="body-text clearfix" itemprop="articleBody">
The strategy includes a st...</div>

实现此功能将为您提供以下内容：