twitter-bootstrap Bootstrap 破坏了 ul 和 li 元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21130489/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap spoiling the ul and li elements
提问by coder
I am making a simple web app. Today, I decided to include bootstrap, to use some UI elemets. Anyhow, including bootstrap is spoiling whatever css I had developed myself. Even !importantis unable to solve the problem.
我正在制作一个简单的网络应用程序。今天，我决定包含引导程序，以使用一些 UI 元素。无论如何，包括引导程序正在破坏我自己开发的任何 css。甚至!important无法解决问题。
Before Bootstrap css file inclusion:
在 Bootstrap css 文件包含之前：
After:
后：
What's wrong? What should I do?
怎么了？我该怎么办？
EDIT:
编辑：
After, including the list-group and list-group-item class, I am getting:
之后，包括 list-group 和 list-group-item 类，我得到：
So, finally, how do I have the text come in the same line as the checkboxes?
那么，最后，如何让文本与复选框位于同一行？
回答by Anup
This is how you should use listin bootstrap :-
这是您应该list在引导程序中使用的方式：-
<ul class="list-group">
<li class="list-group-item"><input type="checkbox"> Hi</li>
<li class="list-group-item"><input type="checkbox"> How</li>
<li class="list-group-item"><input type="checkbox"> Are</li>
<li class="list-group-item"><input type="checkbox"> You</li>
</ul>
You need to apply bootstrap classes for implementing your new layout with bootstrap.
您需要应用引导程序类来使用引导程序实现新布局。
回答by Jay Haase
This syntax will ensure your checkbox labels are also clickable:
此语法将确保您的复选框标签也可点击：
<ul class="list-group">
<li class="list-group-item">
<div class="checkbox">
<label><input type="checkbox" checked>Check me!</label>
</div>
</li>
<li class="list-group-item">
<div class="checkbox">
<label><input type="checkbox" checked>Check me too!</label>
</div>
</li>
</ul>
回答by Jay Haase
Try to inco-operate your css into the class names adopted by bootstrap.
尝试将您的 css 与引导程序采用的类名进行协同操作。
