当我遇到问题时,我开始使用Bootstrap创建一个新的WordPress主题。
我发现当我创建一个带有一些文本和顶部图像(左对齐)的新帖子时,图像实际上没有对齐。 图像位于左上角,文本位于其下方。
我在Google上搜索并阅读了博文等。 大多数人建议在style.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; }
当然,这个方法对我来说没有用,所以我查了一下,我认为问题是因为这些类只有在应用于图像标签时才有效。 访问 the_content()功能时,图像将打印在div标签内。
<div id="attachment_66" style="width: 310px" class="wp-caption alignleft">
<img class="size-medium wp-image-66" src="path/to/img" alt="Sphere" width="300" height="169" sizes="(max-width: 300px) 100vw, 300px">
<p class="wp-caption-text">Who doesn’t like spheres?</p>
</div>
如果问题确实是因为那些标签,我怎样才能将对齐类应用于img而不是div标签?
答案 0 :(得分:1)
感谢@Andrei Gheorghiu,我设法解决了这个问题,我将回答我的问题。
Premade WordPress主题有一些我没有包含的CSS。
所以,这就是你需要包含在style.css中的内容
.alignleft { float:left;}
.alignright { float:right;}
.aligncenter { display: block; margin: auto; }
答案 1 :(得分:0)
而不是创建以下样式:
img.alignleft { float: left; margin: 0 1em 1em 0; }
为什么不创建它:
div.alignleft img { float: left; margin: 0 1em 1em 0; }