CSS:删除通用选择器应用的边框

Question

<span class="span3">
    <input type="text" class="dottedLineInput" placeholder="New milestone name"></niput>
</span>​


textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
background-color: white;
border: 1px solid #CCC;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
-moz-transition: border linear 0.2s, box-shadow linear 0.2s;
-ms-transition: border linear 0.2s, box-shadow linear 0.2s;
-o-transition: border linear 0.2s, box-shadow linear 0.2s;
transition: border linear 0.2s, box-shadow linear 0.2s;
}

.dottedLineInput {
border: 0 !important;
margin-top:20px;
-webkit-box-shadow: 0;
-moz-box-shadow: 0;
box-shadow: 0;
border-bottom: 1px dotted #BBB !important;
}
.dottedLineInput:focus {
 outline: none;   
}

这是代码。通用选择器样式适用于我的输入，我无法摆脱 dottedLineInput 类中的框阴影。我错过了什么？

Answer 1

尝试none，这是box-shadow的默认值:

-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;

如果由于某种原因仍然无法正常工作，请尝试添加 !important:

-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;