我有一个可能很简单的问题,但找不到解决方案。
我正在管理我的自托管 wordpress,并且经常在我发布的文章中添加图片,并且喜欢让它们居中。但是,我注意到在为居中图片添加标题时,它们最终左对齐。你可以看一个例子 here (第一张和第二张图片)。
“无标题&对齐”图片代码为:
<p style="text-align: center;">
<a rel="attachment wp-att-1949" href="http://themikal.com/?attachment_id=1949">
<img class=" size-large wp-image-1949 aligncenter" title="hildolfr1" src="http://themikal.com/wp-content/uploads/2011/05/hildolfr1-566x400.jpg"alt="" width="391" height="276" />
</a>
</p>
而“标题和未对齐”图片代码将是:
[caption id="attachment_1949" align="aligncenter" width="391" caption="Hildolfr"]
<a rel="attachment wp-att-1949" href="http://themikal.com/?attachment_id=1949">
<img class=" size-large wp-image-1949 aligncenter " title="hildolfr1" src="http://themikal.com/wp-content/uploads/2011/05/hildolfr1-566x400.jpg" alt="" width="391" height="276" />
</a>
[/caption]
我尝试添加 <p style="text-align: center;"></p>
到标题图片代码,在标题括号外或内部,但没有结果。
有人知道它为什么会有那样的 react 吗? wordpress.stackexchange决定这是一个与 css 相关的问题,因此在这里更相关。
我是 CSS 的新手,我使用的是预先设计的代码,然后我对其进行了大量修改。但如果有人指出它所在的位置,我可以提供有关 CSS 中某些信息的更多信息。
非常感谢!
最佳答案
虽然很尴尬,但我在问这个问题之前几分钟就解决了这个问题而没有意识到这一点。
CSS 缺少以下几行:
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}
所以它无法理解 img class = aligncenter
的含义。重新添加这些行解决了问题。
关于css - 取消其图像中心的标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9364028/