默认css修改

input--------------------------------------------------
.input-item input{
width: 100%;
height: 60px;
border-radius: 10px;
box-shadow:0px 8px 32px 0 rgba(132,148,194,0.28) ;
border: 0;
padding:0 20px;
border: 2px solid transparent;

}
.input-item input[type=text]:focus, input[type=password]:focus {
border: 2px solid #1A33D5;
}
.input-item input{outline:none}
.login-sotr label{
color: #666;
font-size: 12px;
}
单选--------------------------------------------------
input[type="radio"]{
appearance: none;
-webkit-appearance: none;
width: 16px;
height: 16px;
position: relative;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
border: 2px solid transparent;
box-sizing: border-box;
padding: 3px;
z-index: 5;
}
input[type="radio"]:before{
content: '';
width: 16px;
height: 16px;
position: absolute;
left: -2px;
top:-2px;
border: 1px solid rgba(191,191,191,1);
border-radius: 50%;
box-sizing: border-box !important;
z-index: 0;
}
input[type="radio"]:active{
outline: none;
}
input[type="radio"]:checked{
outline: none;
background: #1FB4FE;
border-radius: 50%;
background-clip:content-box;
border: 2px solid #1FB4FE;
}
多选--------------------------------------------------
input[type="checkbox"]:focus{
outline: none;
}

input[type="checkbox"]{
width: 16px;
height: 16px;
margin: 0;
position: relative;
}
input:before{
content: '';
width: 16px;
height: 16px;
position: absolute;
left: 0;
top: -1px;
border-radius: 3px;
border: 1px solid #eee;
box-sizing: border-box;
}
input[type="checkbox"]{
appearance:none;
-webkit-appearance:none;
outline: none;
}
input[type="checkbox"]:checked{
appearance:none;
-webkit-appearance:none;
background:url('../static/img/sure.png') no-repeat;
outline: none;
border-radius: 3px;
}
posted @ 2018-04-22 08:58  ThisCall  阅读(206)  评论(0编辑  收藏  举报