ZH奶酪：利用CSS將checkbox選項放大

在Hybrid App開發過程當中，html中默認的checkbox選項在手機屏幕上顯得比較小，app不能像web page那樣放大縮小，因此要經過CSS將checkbox選項放大：

例如HTML代碼：

<input type="checkbox" /><span>複選框</span>

CSS放大checkbox方法一（僅IE）：

input[type=checkbox] {
  zoom: 200%;
}

CSS放大checkbox方法二（CSS transform通用）：

input[type=checkbox] {
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FireFox */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
}

兩個方法均可以達到將checkbox放大的目的；

方法1很簡單，利用zoom就是將整個控制項放大，不過有可能致使排版問題（由於zoom是IE瀏覽器中的東東，因此其餘瀏覽器不支持）；

方法2比較經常使用，稍微複雜一點，可是不會致使排版問題。

CSS3 transform屬性

W3school CSS3 transform教程：http://www.w3school.com.cn/cssref/pr_transform.asp

完整CSS3教程：http://www.w3school.com.cn/css3/index.asp

transform 屬性向元素應用 2D(點我) 或 3D(點我) 轉換。該屬性容許咱們對元素進行旋轉、縮放、移動或傾斜。

例如這個演示地址

旋轉div元素

div
{
transform:rotate(7deg);
-ms-transform:rotate(7deg);     /* IE 9 */
-moz-transform:rotate(7deg);     /* Firefox */
-webkit-transform:rotate(7deg); /* Safari 和 Chrome */
-o-transform:rotate(7deg);     /* Opera */
}