我用的是botostrap CSS。 我想在一行中对齐3个div,所以我在引导CSS中使用了类“row”。 我知道那一行有display:flex,它使高度自动保持不变。
我想要的高度不是一样的。 没有Flex的情况下,还有其他方法来调整DIV吗?
null
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<div class="row justify-content-center">
<div class="bg-primary col-md-2 ml-3 mr-3 text-center" >
<p>HHAHAHAHA</p>
<p>HHAHAHAHA</p>
<p>HHAHAHAHA</p>
</div>
<div class="bg-danger col-md-2 ml-3 mr-3 text-center" >
<p>HHAHAHAHA</p>
</div>
<div class="bg-warning col-md-2 ml-3 mr-3 text-center" >
<p>HHAHAHAHA</p>
</div>
</div>
null
您可以使用align-items-start
类(请参阅https://getbootstrap.com/docs/4.5/utilities/flex/#align-items
null
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<div class="row justify-content-center align-items-start">
<div class="bg-primary col-md-2 ml-3 mr-3 text-center" >
<p>HHAHAHAHA</p>
<p>HHAHAHAHA</p>
<p>HHAHAHAHA</p>
</div>
<div class="bg-danger col-md-2 ml-3 mr-3 text-center" >
<p>HHAHAHAHA</p>
</div>
<div class="bg-warning col-md-2 ml-3 mr-3 text-center" >
<p>HHAHAHAHA</p>
</div>
</div>