亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用rgba怎么把一個單選框或者復選框設置為透明?

使用rgba怎么把一個單選框或者復選框設置為透明?

長風秋雁 2019-05-24 09:48:12
input[type="radio"]{background:rgba(0,0,0,0);}為什么我這樣寫無效呢?想用rgba將單選框設置為透明,然后通過偽元素設置樣式來重置單選框的默認樣式。
查看完整描述

2 回答

?
蕪湖不蕪

TA貢獻1796條經驗 獲得超7個贊

給input[type="radio"]設置-webkit-appearance:none;再配合background:rgba(0,0,0,0)就可以把原生樣式隱藏了,然后再通過偽元素設置新的樣式。
                            
查看完整回答
反對 回復 2019-05-24
?
小唯快跑啊

TA貢獻1863條經驗 獲得超2個贊

其實你可以直接將其display:none隱藏的,用labelforid來綁定input,點擊label來控制radio
input[type="radio"]{
opacity:0;
}
input[type="checkbox"]:checked+label:after{
content:'\2714';
background-color:#ff5757;
color:#FFF;
border-color:#ff5757;
}
input[type="checkbox"]{
display:none;
}
label:after{
content:'';
position:absolute;
left:0;
top:0;
width:18px;
height:18px;
border:1pxsolid#CCC;
box-sizing:border-box;
line-height:18px;
text-align:center;
border-radius:3px;
font-size:14px;
}
label{
position:relative;
padding-left:25px;
box-sizing:border-box;
line-height:20px;
font-size:14px;
height:20px;
}
#top{
margin:100px;
}
input[type="checkbox"]:checked~img{
transform:translateX(500px);
}
#img{
transition:all1s;
}
噓噓噓噓噓
                            
查看完整回答
反對 回復 2019-05-24
  • 2 回答
  • 0 關注
  • 401 瀏覽
慕課專欄
更多

添加回答

了解更多

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號