Css 移除 iOS 输入阴影

发布于04月22日

在iOS(Safari 5)上，我必须对输入元素(顶部内部阴影)执行以下操作:

我要删除顶部阴影，错误-webkit-appearance无法保存.

当前样式为:

input {    
    border-radius: 15px;
    border: 1px dashed #BBB;
    padding: 10px;
    line-height: 20px;
    text-align: center;
    background: transparent;
    outline: none;    
    -webkit-appearance: none;
    -moz-appearance: none;
}

推荐答案

您需要使用-webkit-appearance: none;来覆盖默认的IOS样式.然而，仅 Select CSS中的input标签将不会覆盖默认IOS样式，因为IOS通过使用属性 Select 器input[type=text]添加其样式.因此，您的CSS将需要使用属性 Select 器来覆盖已预先设置的默认iOS CSS样式.

Try this:个

input[type=text] {   
    /* Remove First */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    /* Then Style */
    border-radius: 15px;
    border: 1px dashed #BBB;
    padding: 10px;
    line-height: 20px;
    text-align: center;
    background: transparent;
    outline: none;    
}

Helpful Links:

You can learn more about 100 here:

100

If you'd like to learn more about CSS attribute selectors, you can find a very informative article here:

100