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;
}

使用HTML对齐图像

1 个答案: