css – 什么是最好的方法来设置复选框列表

前端之家收集整理的这篇文章主要介绍了css – 什么是最好的方法来设置复选框列表前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想要实现的是这样的布局
some label  [ ] checkBox 1
            [ ] checkBox 2
            [ ] checkBox 3
            [ ] checkBox 4

[]代表一个复选框

什么标记和CSS最适合使用?
我知道这对桌子来说很容易
我想知道这是否可以使用div

解决方法

我会用这个标记
<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;
}

桌子不是邪恶的,但是它们常常用于错误的原因。它们使更大的html文件(对于性能和带宽不利),通常具有更加混乱的html结构(对可维护性不利)。然而,对于表格数据,它们是非常好的。

猜你在找的CSS相关文章