input框css样式设置

1,224 阅读1分钟

HTML

<form action="javascript:return true;">
    <input 
        type="number" 
        v-model="counter">
</form>

CSS

input{
    outline: none;// 使用outline属性去掉淡蓝色边框
    margin:0 13px; //默认带有margin
    width:61px;
    height:22px;
    line-height: 22px;
    text-align: center;
    border: 0;
    background:rgba(235,82,134,1);
    border-radius:5px;
    // font-size:***;字体大小最好不要设置 ios上有兼容性问题
    font-family:Source Han Sans CN;
    font-weight:400;
    color:rgba(255,255,255,1) !important;//字体颜色
    caret-color:rgba(255,255,255,1) !important;//光标颜色
}
input::placeholder {
    line-height: 22px;
    font-size: 4vw;
    color: #BCBCBC;
    text-align: left;
}