使用 SVG 制作單選和多選框動畫【附源碼】

　　

　　溫馨提示：為保證最佳的效果，請在 IE10+、Chrome、Firefox 和 Safari 等現代浏覽器中浏覽。

　　這是一個簡單的表單 HTML 結構示例：

　　我們使用的是無序清單，包含輸入框和标簽。核心的樣式用于使輸入框不可見并使用僞元素建立自定義的輸入框：

　　當輸入框被選中時，我們動态改變“僞複選框”的不透明度和标簽的顔色：

您可能感興趣的相關文章

<a href="http://www.cnblogs.com/lhb25/p/transitions-for-off-canvas-navigations.html" target="_blank">創意無限！一組網頁邊欄過渡動畫【附源碼下載下傳】</a>

<a href="http://www.cnblogs.com/lhb25/p/page-loading-effects.html" target="_blank">真是好東西！13種非常動感的頁面加載動畫效果</a>

<a href="http://www.cnblogs.com/lhb25/p/9-amazing-checkbox-effect.html" target="_blank">你見過嗎？9款超炫的複選框（Checkbox）效果</a>

<a href="http://www.cnblogs.com/lhb25/p/metronic-responsive-admin-dashboard-template.html" target="_blank">超贊！基于 Bootstrap 的響應式的背景管理模闆</a>

<a href="http://www.cnblogs.com/lhb25/p/special-effects-with-magic-css3-animations.html" target="_blank">Magic CSS3 – 幫助你實作神奇的互動動畫效果</a>

歡迎任何形式的轉載，但請務必注明出處。