可以通过多种方式将复选框或单选按钮与其标签对齐。下面描述了一些最简单的方法，在不同的浏览器中使用适当的代码和输出。现在可以通过各种方式来完成样式以对齐复选框及其标签。对于本文，我们使用在 style 标签下完成的内部样式表。
方法一：通过使checkbox的位置相对，设置vertical-align居中可以对齐checkbox及其标签。在这里，我们设置了复选框相对于标签的位置。所以复选框是根据标签对齐的。
例子：
Aligning Checkboxes consistently
in cross browsers
Geeksforgeeks
输出：
- 火狐浏览器：
- 谷歌浏览器：
- IE浏览器：
方法2：通过使用flex display，由于display设置为flex并且对齐居中，所以checkbox和label都对齐到横轴的中心。
例子：
Aligning Checkboxes consistently
in cross browsers
Geeksforgeeks
输出：
- 火狐浏览器：
- 谷歌浏览器：
- IE浏览器：
方法三：通过将label和checkbox分组到同一个block中，可以让checkbox和label在跨浏览器中一致对齐。
例子：
Aligning Checkboxes consistently
in cross browsers
Geeksforgeeks
输出：
- 火狐浏览器：
- 谷歌浏览器：
- IE浏览器：
