我无法让4个按钮排成两行。我试过使用Flexbox，但我只能让它们排成两行，每行三个按钮在顶部，一个在底部。理想情况下，按钮应位于页面中央，彼此之间的距离相等。

HTML代码

CSS代码

结果

顺晟科技：

您必须在同一行中的2个按钮周围添加DIV.代码如下.

<代码>按钮{边距：5px；}

<代码><；细分（>；）<；Button类=“按钮_时态”>；<；a>；存在<；/a>；<；/Button&>；<；Button类=“ Button_时态”>；<；a>；过去<；/a>；<；/Button&>；<；/DIV>；<；细分（>；）<；Button Class=“ Button_时态”>；<；a>；将来<；/a>；<；/Button&>；<；Button类=“ Button_时态”>；<；a>；未完成<；/a>；<；/Button&>；<；/DIV>；

您可以使用Flexbox以这种方式执行此操作。请注意，您必须创建两个容器作为父容器来保存按钮。

.button_tense{
    width:300px;
    height: 300px;
    
}
.container{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

<代码><；DIV类=“容器”>；<；Button类=“按钮_时态”>；<；a>；存在<；/a>；<；/Button&>；<；Button类=“ Button_时态”>；<；a>；过去<；/a>；<；/Button&>；<；/DIV>；<；DIV类=“容器”>；<；Button Class=“ Button_时态”>；<；a>；将来<；/a>；<；/Button&>；<；Button类=“ Button_时态”>；<；a>；未完成<；/a>；<；/Button&>；<；/DIV>；

网格和这个一起

    <div class="container">
        <button class="button_tense"><a >present</a></button>
    <button class="button_tense"><a >past</a></button>
    </div>
    
    <div class="container">
        
    <button class="button_tense"><a >future</a></button>
    <button class="button_tense"><a >imperfect</a></button>
    </div>

<代码><；DIV类=“容器”>；<；Button类=“按钮_时态”>；<；a>；存在<；/a>；<；/Button&>；<；Button类=“ Button_时态”>；<；a>；过去<；/a>；<；/Button&>；<；Button Class=“ Button_时态”>；<；a>；将来<；/a>；<；/Button&>；<；Button类=“ Button_时态”>；<；a>；未完成<；/a>；<；/Button&>；<；/DIV>；

我建议你去看看这个。网格

还有这个Flexbox