如何让复选框更大？

Question

我的网页使用复选框.它们看起来很小.我尝试使用"font-size:1.5em"使它们更大.这似乎根本没有改变它们.

有没有一种简单的方法可以让复选框更大？

谢谢,

Answer 1

你可以使用图像来做到这一点.

CSS

#mycheckbox
{ 
    display: none; 
}

#mycheckbox + label
{ 
    float: left; 
    width: 200px; 
    height: 200px; 
    background: url('/path/to/photo_of_big_unchecked_box.png'); 
}

#mycheckbox:checked + label
{ 
    background: url('/path/to/photo_of_big_checked_box.png'); 
}

HTML

<input type="checkbox" name="mycheckbox" id="mycheckbox"><label for="mycheckbox"></label>

这是你实现目标的一种方式.

编辑

这是IE的工作链接

Answer 2

您无法更改大多数浏览器中复选框的外观。检查这个：http://www.456bereastreet.com/lab/styling-form-controls-revisited/checkbox/

尝试添加一个元素并使其更改复选框的状态。检查这个示例：http ://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/