checkbox radio 通過CSS自定義外觀

2021-07-11 15:39:47 字數 978 閱讀 3518

input

、button

可以通過

css自定義外觀,而

checkbox radio

則沒辦法通過

css自定義樣式。今天逛

google

+的時候發現了乙個利用

css3

偽元素:

after

來自定義

checkbox radio

樣式的方法。利用

css3

不僅可以自定義

checkbox radio

的邊框或背景還可以改變選中時的樣式。具體看以下**:

css**:

input

[type

=checkbox

],input

[type

=radio

]input

[type

=checkbox

]:active

,input

[type

=radio

]:active

input

[type

=checkbox

]:hover

input

[type

=radio

]input

[type

=checkbox

]:checked

,input

[type

=radio

]:checked

input

[type

=radio

]:checked

::after

input

[type

=checkbox

]:checked

::after

input

[type

=checkbox

]:focus

checkbox,radio的傳值和標籤

前段時間一直搞不懂用checkbox,radio時該怎麼用,經過實踐後才知道。對於checkbox 只有當它處於選中狀態的時候才會把它的name和對應的value傳過去,如果不選中的話,則在接收端收 不到任何關於此checkbox的資訊,相當於在頁面的表單裡沒有放進checkbox型別的 對於rad...

微信小程式重寫checkbox radio樣式

1 方形對勾 重寫 checkbox 樣式 未選中的 背景樣式 checkbox wx checkbox input 選中後的 背景樣式 紅色背景 無邊框 可根據ui需求自己修改 checkbox wx checkbox input.wx checkbox input checked 選中後的 對勾...

checkbox radio設定自定義樣式

老生常談,做乙個簡單的記錄。瀏覽器自帶的checkbox和radio樣式可能不符合專案要求,通常要做一些自定義樣式設定,目前基本的解決思路都是將input type checkbox radio 隱藏,用label去與input做聯動處理,具體實現方法有以下兩種 123 43637 方法139 40...