什么是最好的方式来设置一个复选框列表的样式？
什么是最好的方式来设置一个复选框列表的样式？
提问于 2018-04-10 01:10:23
我想实现的是这样的布局
some label [ ] checkbox 1
[ ] checkbox 2
[ ] checkbox 3
[ ] checkbox 4表示复选框。什么标记和CSS最适合用于此？
回答 2
Stack Overflow用户
发布于 2018-04-10 09:53:52
我会使用这个标记：
<div id="checkboxes">
<label>some label</label>
<ul>
<li><input type="checkbox"> checkbox 1</li>
<li><input type="checkbox"> checkbox 2</li>
<li><input type="checkbox"> checkbox 3</li>
<li><input type="checkbox"> checkbox 4</li>
</ul>
</div>这些风格：
#checkboxes label {
float: left;
}
#checkboxes ul {
margin: 0;
list-style: none;
float: left;
}Stack Overflow用户
发布于 2018-04-10 11:04:01
这个非常语义的HTML：
<fieldset class="checkboxgroup">
<p>some label</p>
<label><input type="checkbox"> checkbox 1</label>
<label><input type="checkbox"> checkbox 2</label>
<label><input type="checkbox"> checkbox 3</label>
<label><input type="checkbox"> checkbox 4</label>
</fieldset>这个非常简单的CSS：
.checkboxgroup{
width: 20em;
overflow: auto;
}
.checkboxgroup p{
width: 7em;
text-align: right;
}
.checkboxgroup label{
width: 12em;
float: right;
}根据需要调整宽度。
真正做到这一点的正确方法是替换p元素在我的HTML中使用legend元素，但如果没有一些非常难看的CSS，这将不会按照您希望的方式进行样式设计。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/-100008036
复制相关文章
相似问题