標題：用 CSS 製作大型 Checkbox
出處：A.PAO designSTUDIO BLOG
時間：Mon, 06 Apr 2015 21:28:52 +0000
作者：apao
地址：https://blog.apao.idv.tw/post/1105/

內容：

點擊在新視窗中瀏覽此圖片
https://blog.apao.idv.tw/attachment.php?fid=2144


HTML Source
<input type="checkbox" class="bLarger" name="checkBox">


Source Code
<style type="text/css">
input.bLarger{width: 20px; height: 20px;}</style>


使用 font-size:200%; 也不見效。

▼幸運的是手機也能呈現

點擊在新視窗中瀏覽此圖片
https://blog.apao.idv.tw/attachment.php?fid=2145


參考網站：
http://lab.artlung.com/larger-checkbox-with-css/

Firefox或是其他瀏覽器就要改用設定兩倍尺寸大小的方法
input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  padding: 10px;
}


參考網站：
http://stackoverflow.com/questions/306924/checkbox-size-in-html-css


Generated by Bo-blog 2.1.1 Release