伪元素改变text类型input框的默认样式实例页面

回到相关文章 »

代码:

CSS代码:
.value ::-ms-value {
    padding: 4px;
    color: #34538b;
    border: 1px solid #a0b3d6;
    background-color: #f0f3f9;
}
.value ::-ms-clear {
    margin-left: 2px;
    color: #34538b;
    border: 1px solid #a0b3d6;
    background-color: #f0f3f9;
}

.clear .deal::-ms-clear { display: none; }
                
HTML代码:
<p class="value">
    <input type="text" value="雅美蝶你能再深一点么">
    <input type="password" value="雅美蝶你能再深一点么">
    <select><option selected>雅美蝶你能再深一点么</option></select>
</p>
<p class="clear">
    <input type="text"><br><br>
    <input type="text" class="deal">
</p>
                

效果: