html - 为什么这些图像不接受显示 : inline property?

Question

我正在使用 WordPress Twenty Sixteen 主题。我创建了一个页面，现在我在其中插入了 4 张图片。当我打开页面时，图像以垂直顺序显示，即 1 在其他之上。它们也没有分配 display: block 属性。我尝试了 display: inline 和 display: inline-block 属性，但它们不起作用。这些在检查元素中清楚地显示，但它们不会影响元素。 (此外，float: left 工作得很好，但我希望 display: inline 工作)。

问题是什么，我该如何解决？这是页面中的文字:

<div id="gal-1">
<img src="http://localhost/microsoft/wp-content/themes/twentysixteen/images/surface.jpg" alt="" />
<img src="http://localhost/microsoft/wp-content/themes/twentysixteen/images/lumia.jpg" alt="" />
<img src="http://localhost/microsoft/wp-content/themes/twentysixteen/images/windows.jpg" alt="" />
<img src="http://localhost/microsoft/wp-content/themes/twentysixteen/images/edge.jpg" alt="" />
</div>

Answer 1

如果你使用它，它将起作用:

div#gal-1>img {
   display:inline;
}

当它是 img 时，这将匹配 div gal-1 child。如有必要，请使用 !important 来覆盖任何显示: block ；