我正在使用 Bootstrap 中的行类。该行有两列。一个用于 x，一个用于 Y。 在动态情况下，行内将有 X 列或 Y 列或两列。 我的查询是因为一行可以有 12 列，所以当我只有 X 列时，它将采用 col-md-12，当有 X 和 Y 双列时，X 和 Y 将采用 col-md-6 和 col -md-6 分别在行内。
例子
<div class="row">
<div class="col-md-6">x</div>
<div class="col-md-6">y</div>
</div>
当只有一个来自数据库的元素(X)出现时
<div class="row">
<div class="col-md-12">x</div>
</div>
谢谢!
最佳答案
您可以尝试将 col 类设置为所有 div 它会自动调整宽度。然而，它在所有设备上的行为都是一样的。
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<body>
<div class="container-fluid">
<div class="row">
<div class="col" style="background-color:red;">Div 1</div>
</div>
<div class="row">
<div class="col" style="background-color:yellow;">Div 1</div>
<div class="col" style="background-color:orange;">Div 2</div>
</div>
</div>关于html - 如何在有一个元素时在 bootstrap 中显示一列，而在有两个元素时显示两列，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55261527/