1.沒有用bootstrap時：
1 .has_sel,.un_sel2.使用bootstrap時（因為bootstrap中css設定了*box-sizing: border-box;屬性，所以會影響定位的位置），需要將bottom下移乙個畫素；即bottom：2px；2 .has_sel:before
9 .has_sel:after
3.效果圖
4.總結
之前一直用背景圖做這個記住密碼單選框，每一次這個框都大差不差，最多就是顏色差異，或者圓角直角的差異，現在用純css寫出來不僅不用每次都要作圖，而且還提高了效率。感興趣的同學可以搜尋 pure css icon 看看，感覺很吊的樣子。
純css設定單選框 進度條樣式
1.設定radio樣式 注意 radio的id要和對應的label 的for相同。原理 使用 checked label 切換樣式。checkbox也可以這麼做。css input type radio label l1 l2 r1 checked label r2 checked label ht...
Vue 單選框與單選框組 元件
v model 通過當然繫結的值與input上的value值來確定當前選中項。在父作用域中通過active設定當前預設選中項,如果選中項發生改變後通過input事件通知傳遞到父作用域,告知當前選中項.自定義元件 v model 資料雙向繫結 radio v model active label 1 ...
js 多選框 單選框
此多選框 單選框可以換按鈕 只更改雪碧圖的定位即可。沒有使用自帶的控制項，是重新寫的。用到了模組化開發，類的匯出匯入，類的繼承。type module import radio from js radio.js import checkbox from js checkbox.js let hobb...