checkbox應該是一個比較常用的html功能了，不過瀏覽器自帶的checkbox往往樣式不怎么好看,，而且不同瀏覽器效果也不一樣,。出于美化和統(tǒng)一視覺效果的需求,，checkbox的自定義就被提出來了。這里對實現(xiàn)方法做個總結(jié)<!-- more -->

純css實現(xiàn)的主要手段是利用label標簽的模擬功能,。label的for屬性可以關聯(lián)一個具體的input元素,，即使這個input本身不可被用戶可見,，有個與它對應的label后,，用戶可以直接通過和label標簽交互來替代原生的input——而這給我們的樣式模擬留下了空間。簡而言之就是

隱藏原生input,，樣式定義的過程留給label （那為什么不直接改變checkbox的樣式,？因為checkbox作為瀏覽器默認組件，樣式更改上并沒有l(wèi)abel那么方便,，很多屬性對checkbox都是不起作用的,，比如background,而label在樣式上基本和div一樣'任人宰割')

1找兩張勾選復選框后和前的圖片。我是在淘寶矢量圖上找的,。代碼在下面