5分鐘DIY乙個自定義單選框單選按鈕

2021-07-25 19:49:08 字數 1166 閱讀 6103

轉眼間2023年了,在這裡祝大家2017都能展翅高飛心想事成

上次寫博已經是兩個月前了,這兩個月七搞八搞學了不少黑科技日後必會分享給大家~下面咱們就開門見山了

由於瀏覽器本身自帶的單選按鈕且不說好看不好看,各大瀏覽器廠商也是一人乙個樣兒想要統一效果相對來說比較麻煩,所以我們常見的做法就是自定義乙個單選按鈕。像這樣的效果:

這樣的乙個性別選擇按鈕非常的常見,類似的效果也都可以用這種方法寫出來。

.rdo 

.rdo:before,.rdo:after

.rdo:before

.rdo:after

.rdo:checked:after

.rdo:checked:before

沒錯,這裡就是全部**了,就是這麼簡單!如果你看懂了的話是不是感覺so easy?哈哈~

假如你沒看懂也沒關係,我們來一點點看。

1.在html結構中新增兩個普通的單選按鈕

2.設定input的樣式,將寬高任意乙個設為0,全為0也可以

.rdo
3. 利用**before**和**after**偽元素自定義單選按鈕的樣式

4. 當單選按鈕被選中時改變被選中按鈕身上before和after偽元素的樣式,如上圖中所示(圖畫得賊醜∩_∩,見諒)

.rdo:checked:after 

.rdo:checked:before

原創 5分鐘學會Flex自定義事件

網上介紹flex自定義事件的日誌有幾篇,重複的就不算了哈。先說下login,userinfo那個,它的思路就是 1.先自定義乙個事件,就是繼承event類就可以了,宣告個靜態字元常量,再了解一下建構函式的引數。如果想用事件傳遞資料就定義乙個變數,什麼型別的變數都行,事件也是個類,它可以有自己的隨意的...

自定義乙個死鎖

在鎖o1釋放之前需要等待鎖o2的釋放 在鎖o2釋放之前需要等待鎖o1的釋放.死在無限等待對方釋放鎖的迴圈中.這只是乙個簡單的死鎖 a需要b,b需要a 複雜一些的有 a需要b,b需要c,c需要a.public class demo6 implements runnable catch interrup...

自定義乙個TagLayout

自定義乙個標籤自動排版顯示的布局。效果 思路 一 確定布局的寬,高。寬度確定 所有行中,寬度最寬的行即為這個布局的寬。高度確定 所有行的高度加起來 即 為這個布局的高度。二 擺放子view思路 如果能夠確定每乙個child的 right 和 bottom 或者 left,top,那麼就可以遍歷每乙個...