html - 我如何使它使每个图像/按钮都在一列中？

Question

我正在创建一个测试站点，我想将这些图像/按钮放入从左到右的列中，如果您知道如何并且可以帮助我，我将不胜感激。我试过用谷歌搜索它，但它变干了，我试过了，但我不太擅长编辑我的代码。

<div class='box'>

    <form action="/naruto_shippuden">
      <input type="image" src="images/naruto_shippuden.jpg" alt="Submit" width="100" height="150">
      <h6 class='txt'><b>Naruto Shippuden</b></h6>
    </form>

    <form action="/naruto">
      <input type="image" src="images/naruto.jpg" alt="Submit" width="100" height="150">
      <h6 class='txt'><b>Naruto</b></h6>
    </form>

    <div align='right'>
      <form action="/Deathnote/">
        <input type="image" src="images/naruto.jpg" alt="Submit" width="100" height="150">
        <h6 class='txt'><b>Deathnote</b></h6>
      </form>
    </div>
    
  </div>

谢谢。

- 利亚姆C。

标签： htmlcss

Answer 1

添加display: flex到您的 div .box 类

我做了什么：

<div class='box' style='display: flex'>