css - CSS中的一张图片在另一张图片下方

Question

如何使用 CSS 让一张图片出现在另一张图片下方？例如，我正在尝试实现类似

[image 1.jpg]
[image 2.jpg]

我是 CSS 初学者

这是我的代码，为什么它不起作用？：

<img { display: block; width: 246px; height: 203px; } title="Chocolate Moltres Cake Recipe" src="print_files/chocolatecake.jpg" alt="Chocolate Moltres Cake Recipe" border="0">
<img { display: block; width: 246px }title="Moltres" src="i.imgur.com/simHG.jpg"; alt="Moltres" border="0">

Answer 1

只需使用这个简单的 CSS 规则：

img {
    display: block;
}

所以，在你的情况下：

<img style="display: block;" src="xxx.jpg" alt="" />

它们将显示在彼此下方。

但是，从 XHTML 1.0 开始，内联 CSS 规则 ( style="") 不再有效。您应该使用链接到您的 HTML 的外部 CSS 文件。

JSFiddle 链接

我建议您阅读有关 CSS的W3Schools页面。我从这里学到了。