图像对齐不适用于我自己的 WP 主题答案

【问题标题】：Image alignment not working on my own WP theme图像对齐不适用于我自己的 WP 主题
【发布时间】：2016-06-28 11:15:09
【问题描述】：

我正在构建自己的 Wordpress 主题，我正在尝试通过帖子编辑器将图像对齐到中心或侧面，但它仍然默认对齐（左）。

虽然在编辑器中它不能正确显示在网站上。

【问题讨论】：

【解决方案1】：

接受的答案对我不起作用，对于那些从头开始开发主题并遇到相同问题的人，将以下代码添加到对我有用的主题样式表中：

img.alignright { float: right; margin: 0 0 1em 1em; }
img.alignleft { float: left; margin: 0 1em 1em 0; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

来源：https://codex.wordpress.org/Wrapping_Text_Around_Images

【讨论】：

谢谢。它帮助了我！
@Nick 很高兴它有帮助:)
为什么 wp 需要一些额外的 css？

【解决方案2】：

您尚未共享代码...但您需要确保在主题的 CSS 文件中包含 WordPress-generated classes：

/* =WordPress Core
-------------------------------------------------------------- */

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

当然，您可以根据需要修改这些类。

【讨论】：

谢谢！这绝对是我想要的。
谢谢，我注意到了这些类，但想知道样式需要从哪里来。现在很明显：D

【解决方案3】：

img.alignright { float: right; margin: 0 0 1em 1em; }
img.alignleft { float: left; margin: 0 1em 1em 0; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

应用这个 css 来获得对齐类功能

【讨论】：