Rumah > Artikel > hujung hadapan web > css input样式怎么修改
css input样式怎么修改
- 藏色散人asal
- 2021-04-19 09:28:417359semak imbas
css input样式修改的方法：1、利用伪类元素改变radio样式；2、利用label指向input，然后通过改变label样式来达到效果即可。
本文操作环境：Windows7系统、Dell G3电脑、HTML5&&CSS3版。
css改变input框样式
目前博主只知道两种方法，如果有同学有别的方法欢迎进行讨论
一：利用伪类元素改变radio样式 （此方法无需添加额外的标签，更便捷）
.div input[type=radio]::after {
position: absolute;
width: 25px;
height: 25px;
background: url(../img/inputBG.jpg) no-repeat;
background-size: 100% 100%;
}二：利用label指向input，通过改变label样式来达到效果
<html>
<input type="checkbox" checked="checked" id="aa"/><label for="aa"></label>
</html>
<style>
input[type=checkbox]{
visibility: hidden;
}
label{
width:20px;
height:20px;
border:1px solid #707070;
}
input[type=checkbox]:checked + label{
background: url(../img/duigou.jpg)no-repeat;
background-size: 100% 100%;
}
</style>【推荐学习：css视频教程】
Atas ialah kandungan terperinci css input样式怎么修改. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：css输入框怎么设置不可编辑Artikel seterusnya：css怎么设置最大宽度