使用HTML对齐图像

Question

我正在尝试设计一个网页。我对HTML没有多少经验，因此很难让我的页面看起来如何计划。我想有四个方形图像，两个直接位于下方的两个顶部，但我正努力对齐这些。我试图研究这个，但所有我似乎能够找到与文本换行的例子。 任何帮助表示赞赏，谢谢。

Answer 1

你的图像尺寸是否相同？

没有关于您的网页上想要什么的更多信息，很难知道您需要什么。 但是这里有一个简单的例子：http://codepen.io/cecileledoux/pen/mWJyGV

<section> 
    <figure> 
     <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png" alt="" /> 
    </figure> 
    <figure> 
     <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png" alt="" /> 
    </figure> 
</section> 
<section> 
    <figure> 
     <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png" alt="" /> 
    </figure> 
    <figure> 
     <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png" alt="" /> 
    </figure> 
</section> 

section{ 
    margin-bottom: 20px; 
    text-align: center; 
} 
figure{ 
    display: inline-block; 
}