html - 网格中的 IMG html css

Question

所以基本上我想要实现的是：

我想要的是

.row {
  display: -ms-flexbox;
  /* IE 10 */
  display: flex;
  -ms-flex-wrap: wrap;
  /* IE 10 */
  flex-wrap: wrap;
  padding: 0 4px;
  margin: 0% 20%;
}

.column {
  -ms-flex: 50%;
  /* IE 10 */
  flex: 50%;
  padding: 0 4px;
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  width: 500px;
  height: 350px;
}

<div class="row">
  <div class="column">
    <img src="/images/classic.jpg">
    <img src="/images/deep.jpg">
  </div>
  <div class="column">
    <img src="/images/full.jpg">
    <img src="/images/relax.jpg">
  </div>
</div>

这就是我得到的。 结果

所以，基本上 - 我是 html 和 css 的新手（如你所知），我只是无法弄清楚那里有什么问题：/。

标签： htmlcssimageflexbox

Answer 1

如果您的图像文件夹在您当前的路径中，您应该放置点“。” 在你的斜线之前。像这样

 <img src="./images/classic.jpg">
 <img src="./images/deep.jpg">