html - 使复选框的大小更大

Question

我正在尝试使复选框更大。常规尺寸太小

Answer 1

尝试 CSS '转换'

input[type=checkbox] {
  -ms-transform: scale(2); 
  -moz-transform: scale(2); 
  -webkit-transform: scale(2); 
  -o-transform: scale(2); 
  transform: scale(2); }

但它不适用于IE8。 http://www.w3schools.com/cssref/css3_pr_transform.asp

Answer 2

您可以使用图像来更改复选框的样式。

您还可以使用以下已在 Chrome 中测试的 CSS。但这在 Firefox 中不起作用：

input[type='checkbox'] {
    width: 4em;
    height: 4em;
}

如需演示，请访问：http ://www.456bereastreet.com/lab/styling-form-controls-revisited/checkbox/

Answer 3

如果您想保持跨浏览器的兼容性，这很难实现。

您可能需要考虑一个输入替换插件，例如这个。

http://blogs.digitss.com/javascript/jquery-javascript/jquery-fancy-custom-radio-and-checkbox/