input输入框设置样式

作者 : admin 本文共1169个字,预计阅读时间需要3分钟 发布时间: 2024-06-9 共3人阅读

input清除自带样式

input, textarea,label, button,select,img,form,table,a{
    -webkit-tap-highlight-color: rgba(255,255,255,0);
    -webkit-tap-highlight-color: transparent;
    margin: 0;
    padding: 0;
    border: none;
}
/*去除iPhone中默认的input样式*/
input, button, select, textarea{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border:none;
    outline: none;
    resize:none;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

input默认样式

input::-webkit-input-placeholder{color:#C0C4CC}
input:-moz-input-placeholder{color:#C0C4CC}
input::-ms-input-placeholder{color:#C0C4CC}
input::placeholder{color:#C0C4CC}

 input::placeholder,  input::-ms-input-placeholder, input::-webkit-input-placeholder,input::-moz-placeholder{
 color: #e6e6e6;
}

input为某种类型设置样式

input[type="number"]{
    -moz-appearance: textfield;
}

input禁止(disable)设置样式

input:disabled,input[disabled]{
    color: #333333;
    -webkit-text-fill-color: #333333 !important;
    -webkit-opacity: 1;
}

textarea设置默认样式修改


 textarea::placeholder, textarea::-webkit-input-placeholder, textarea::-ms-input-placeholder , textarea::-moz-placeholder {
 color: #999;
}
 input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
 -webkit-box-shadow: 0 0 0 15.625rem #fff inset;
}
本站无任何商业行为
个人在线分享 » input输入框设置样式
E-->