資訊專欄INFORMATION COLUMN
摘要：先看看純美化過后的和效果查看。項目地址在出現(xiàn)之前，我們美化和需要借助，最具代表性的就是，它功能強大復雜并且主題很多。為了更好的在項目中重用，我把美化的代碼寫成一個項目，叫，寓意像魔法一樣去美化和。
Radio和checkbox需要美化嗎？答案是必須的，因為設計風格一直都會變化，原生的樣式百年不變肯定滿足不了需求。
先看看純CSS美化過后的radio和checkbox效果：查看。
項目地址：magic-check
在CSS出現(xiàn)之前，我們美化radio和checkbox需要借助JavaScript，最具代表性的就是icheck，它功能強大復雜并且主題很多。icheck這種美化方案很好很強大，但是也有很多缺點：
太重，需要引入JS、CSS，還有圖片或者字體圖標，而且還依賴jQuery
擴展性差，Pure js項目還好，如果是Angular.js、React、Vue.js或者Meteor項目，一般都需要自己對icheck做wrapper
樣式自定義性不好，修改樣式只能重新做圖
事件行為跟原生不一致
可維護性差、復雜，誰用誰知道
所以，如果的項目不需兼容古董瀏覽器的話，用CSS美化radio和checkbox是最好的選擇，這樣什么都不用依賴，只需CSS，無JS，無圖片，無字體圖標。
為了更好的在項目中重用，我把美化的代碼寫成一個項目，叫magic-check，寓意像魔法一樣去美化radio和checkbox。
用法非常簡單，最好用Bower和npm進行管理，先Install：
bower: ?bower install --save magic-check
npm:? npm install --save magic-check
然后加載CSS文件：
然后，只要給input元素加上一個CSS類magic-checkbox或magic-radio就可以：
Radio
Checkbox
文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/115061.html
摘要：先看看純美化過后的和效果查看。項目地址在出現(xiàn)之前，我們美化和需要借助，最具代表性的就是，它功能強大復雜并且主題很多。為了更好的在項目中重用，我把美化的代碼寫成一個項目，叫，寓意像魔法一樣去美化和。 Radio和checkbox需要美化嗎？答案是必須的，因為設計風格一直都會變化，原生的樣式百年不變肯定滿足不了需求。 先看看純CSS美化過后的radio和checkbox效果：查看。 項目地...
摘要：先看看純美化過后的和效果查看。項目地址在出現(xiàn)之前，我們美化和需要借助，最具代表性的就是，它功能強大復雜并且主題很多。為了更好的在項目中重用，我把美化的代碼寫成一個項目，叫，寓意像魔法一樣去美化和。 Radio和checkbox需要美化嗎？答案是必須的，因為設計風格一直都會變化，原生的樣式百年不變肯定滿足不了需求。 先看看純CSS美化過后的radio和checkbox效果：查看。 項目地...
摘要：現(xiàn)在前端頁面效果日益豐富，默認的組件樣式顯然不能滿足設計需求。前段時間開發(fā)項目中剛好接觸到相關的需求，在此特地整理下修改樣式的方法。它使用純編寫，沒有任何的文件。 現(xiàn)在前端頁面效果日益豐富，默認的input組件樣式顯然不能滿足設計需求。前段時間開發(fā)項目中剛好接觸到相關的需求，在此特地整理下修改radio、CheckBox樣式的方法。 原理：大致原理都是使用原生的checkbox或inp...
摘要：現(xiàn)在前端頁面效果日益豐富，默認的組件樣式顯然不能滿足設計需求。前段時間開發(fā)項目中剛好接觸到相關的需求，在此特地整理下修改樣式的方法。它使用純編寫，沒有任何的文件。 現(xiàn)在前端頁面效果日益豐富，默認的input組件樣式顯然不能滿足設計需求。前段時間開發(fā)項目中剛好接觸到相關的需求，在此特地整理下修改radio、CheckBox樣式的方法。 原理：大致原理都是使用原生的checkbox或inp...
閱讀 2857·2023-04-26 02:49
閱讀 3440·2021-11-25 09:43
閱讀 3367·2021-10-09 09:43
閱讀 2984·2021-09-28 09:44
閱讀 2446·2021-09-22 15:29
閱讀 4503·2021-09-14 18:02
閱讀 2773·2021-09-03 10:48
閱讀 3426·2019-08-30 12:47
