html - 两个图像和两个文本行对齐

Question

我有两个 <img>和两个 <p> (基本字幕文本)

我想在 css 中将它们格式化为这样排列:

<img1>   <img2>
<text1>  <text2>

基本上，两张图片下面有两个标题。

我知道这很简单，但我尝试过的一切都没有奏效。

Answer 1

这是非常基本的东西:

HTML

<div>
    <img src="http://www.placekitten.com/100/100" />
    <p>Text</p>
</div>
<div>
    <img src="http://www.placekitten.com/100/100" />
    <p>Text</p>
</div>

CSS

div {
    float:left;
    text-align:center;
    margin:20px;
}

jsFiddle example

本质上，您将图像/文本对包装在 div 中，并将 div 向左浮动。