首頁 > web前端 > css教學 > 利用CSS3美化單選、複選按鈕的顯示樣式

利用CSS3美化單選、複選按鈕的顯示樣式

高洛峰
發布: 2017-02-11 13:49:31
原創
1419 人瀏覽過

眾所周知,表單中的一寫元素原生樣式不是很好看,項目中用到的時候需要優化,下面這篇文章主要介紹瞭如何利用CSS3美化單選、複選按鈕的顯示樣式,需要的朋友可以參考借鑒,下面來一起看看吧。

前言

相信大家都知道在表單元素中,單選按鈕和復選按鈕都具有選取和未選取狀態。要覆寫這兩個按鈕預設樣式比較困難。在CSS3中,我們可以透過狀態選擇器“:checked”配合其他標籤來實現自訂樣式。利用CSS3我們可以打造非常有個人化的使用者表單,本文實現的效果非常不錯,有興趣的朋友們下面來一起學習學習。

效果圖如下

利用CSS3美化單選、複選按鈕的顯示樣式

實例代碼

reee

+  是css的相鄰選擇符。

關係選擇符只有四種,是空格  >  +   ~(包含選擇符、子選擇符、相鄰選擇符、兄弟選擇符)
更多利用CSS3美化單選、複選按鈕的顯示樣式相關文章請關注PHP中文網!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板