HTML/CSS隐藏复选框

Question

如何使用HTML/CSS隐藏复选框？

让我说我有

<table>
    <thead>
        <th>
         Col A
        </th>
         <th>
         Col B
         </th>
    </thead>
    <tbody>
        <tr>
            <td> <input type="checkbox" class="hidden"> Some stuff </td>
        </tr>
         <tr>
            <td> Some Other stuff </td>
        </tr>
    </tbody>
</table>

复选框的名称和值不是常量.我知道jquery有一些方法,但有没有办法用纯CSS或HTML隐藏它？

Answer 1

请记住,将display属性设置为none会使元素无法访问(请参阅:使用自定义设计将其设置为隐藏时,复选框选项卡索引不起作用).如果你关于辅助功能,你可以使用:

input[type=checkbox].hidden{
  opacity: 0;
}

Answer 2

.hidden {
    display: none;
}

这将隐藏复选框(或任何具有"隐藏"类的HTML项目).该复选框仍然存在于HTML中,可以使用Javascript或带有开发人员工具的访问者启用/禁用.