bootstrap ul 容器基于文本而不是项目符号对齐
[英]bootstrap ul container is aligning based on text instead of the bullet
问题描述
I have a series of paragraph text content followed by some unordered lists.
我有一系列段落文本内容，后跟一些无序列表。 When using class="container " on them it does left alignment with the text instead of the bullet point which leads to the bullet points being awkwardly too far left or in some breakpoints actually being partially cut off at edge of screen.当在它们上使用class="container " 时，它确实留下了 alignment 文本而不是项目符号点，这导致项目符号点笨拙地太靠左或者在某些断点中实际上在屏幕边缘被部分切断。
Is there a correct way or bootstrap idiomatic way to change the styling in this case?在这种情况下，是否有正确的方法或引导惯用的方法来更改样式？
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous"> <p class="container">A paragraph.</p> <ul class="container"> <li>A list item</li> <li>Another list item</li> </ul>
1 个解决方案
解决方案1
1 已采纳 2022-11-14 22:05:14
The container class has no business on a paragraph or a list. class这个container在一段或者一个列表上没有业务。 It's intended as an outer structural element on its own or in conjunction with other grid elements, such as rows and columns.它旨在单独用作外部结构元素或与其他网格元素（例如行和列）结合使用。
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous"> <div class="container"> <p>A paragraph.</p> <ul> <li>A list item</li> <li>Another list item</li> </ul> </div>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.