td里面的CSS样式复选框

Question

我想将表格中的复选框设置为中间/中心

我正在使用的脏方式是

java.lang.Object.getLength(nameOfArray)

但是，我正在寻找表格中所有checbox将居中的方式。所以我出来了一个CSS

<td>
    <input type="checkbox" style="text-align:center;" ng-model="x.dedbuffer">
</td>

但是css没有按预期工作。如何在css中设置样式？

Answer 1

将其设置在input的父级，在本例中为td。

更新了仅定位特定单元格的方法

table td {
    text-align: center;
}

table {
  width: 300px;
}
table td {
  border: 1px solid;
}
table td.centered {
  text-align: center;
}

<table>
  <tr>
    <td class="centered">
      <input type="checkbox" style="text-align:center;" ng-model="x.dedbuffer">
    </td>

    <td>
      Not centered
    </td>
  </tr>
</table>

如果您在同一单元格中有更多内容，请添加包装

table {
  width: 300px;
}
table td {
  border: 1px solid;
  text-align: center;
}
table td div {
  text-align: left;
}

<table>
  <tr>
    <td>
      
      <input type="checkbox" style="text-align:center;" ng-model="x.dedbuffer">

      <div>
        Not centered
      </div>

    </td>
  </tr>
</table>

Answer 2

试试这个

td input[type="checkbox"] {
    width:20px;
    height:20px;
    display:block;
    argin:0px auto;
}

Answer 3

＆＃13;

＆＃13;

function alerrt() {
    alert("I am centered! checkbox");
} 

＆＃13;

table {
  width: 300px;
}
table td {
  min-width: 150px;
  border: 1px solid;
  text-align: center;
  padding:5px;
}
table td lable{
margin-right:10px;
}

＆＃13;

<table>
  <tr>
    <td class="centered">
     <lable> please check </lable> <input type="checkbox" onclick="alerrt()" style="text-align:center;" ng-model="x.dedbuffer">
    </td>



  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;