请看这两张图片。这是我在
上查看网站时的样子我为这个列表使用了简单的 ul 和 li 标签。我如何调整对称性,以便每个 li 在手机上获得 50% 的宽度,并且所有内容在手机上看起来都是对称的。
我用的是bootstrap,如果有bootstrap解决方案就好了。
最佳答案
为什么不使用 bootstrap 网格布局?
ul {
list-style-position: inside;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.css">
<div class="container-fluid">
<ul class="row">
<li class="col-6 col-md-2">Item 1</li>
<li class="col-6 col-md-2">Item 2</li>
<li class="col-6 col-md-2">Item 3</li>
<li class="col-6 col-md-2">Item 4</li>
<li class="col-6 col-md-2">Item 5</li>
<li class="col-6 col-md-2">Item 6</li>
</ul>
</div>
关于css - 无论文本长度如何,如何在移动设备上对称对齐 li 标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43426958/