html - 对齐多个图像

Question

我是网络编码的初学者，所以我开始做一些类似练习的东西，看看我能做什么。

我已经尝试对齐 5 张图片，我一直在网上搜索任何地方，直到现在我发现由于知识有限，我现在找到的所有内容对我来说都非常复杂。

#poze {align:"center"}

<div id="poze">
  <img src="rsz_1rsz_2000px-color_icon_greensvg.png" alt="green" style="padding:3px;border:3px solid black;" />
  <img src="rsz_rsz_2000px-color_icon_bluesvg.png" alt="blue" style="padding:3px;border:3px solid black;" />
  <img src="rsz_rsz_2000px-color_icon_yellowsvg.png" alt="yellow" style="padding:3px;border:3px solid black;" />
  <img src="rsz_1rsz_2000px-color_icon_redsvg.png" alt="red" style="padding:3px;border:3px solid black;" />
  <img src="rsz_1rsz_2000px-color_icon_purplesvg.png" alt="purple" style="padding:3px;border:3px solid black;" />
</div>

我尝试过的任何东西，即使是复杂的东西，都没有用。有没有可能只用 HTML 而不用 CSS 的方法？或者如果需要CSS，有什么简单的方法吗？

Answer 1

不要使用内联样式。

将margin:auto应用到#poze和一个固定的width(选择更适合你的值)

#poze {
  width: 580px;
  margin: auto;
  border: 1px red dashed
}
img {
  padding: 3px;
  border: 3px solid black;
}

<div id="poze">
  <img src="//lorempixel.com/100/100" alt="green" />
  <img src="//lorempixel.com/100/100" alt="blue" />
  <img src="//lorempixel.com/100/100" alt="yellow" />
  <img src="//lorempixel.com/100/100" alt="red" />
  <img src="//lorempixel.com/100/100" alt="purple" />
</div>