css - 删除 Materialise 中的默认输入样式

Question

我想删除 Materialise 中的输入样式。与 Jquerymobile 一样，我可以使用 data-role="none" 删除样式，如何在 Materialize 中执行此操作。我想做一个简单的搜索框，但我为默认样式而烦恼。

Answer 1

这适用于输入文本:

<style type="text/css">

  .MyDiv input[type=text]:not(.browser-default){
    padding: 1% 6%;
     box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border:1px solid #BEBEBE;
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;  
    height: 33px;
}

.MyDiv input[type=text]:not(.browser-default):focus:not([readonly]){
           -moz-box-shadow: 0 0 8px #88D5E9;
    -webkit-box-shadow: 0 0 8px #88D5E9;
    box-shadow: 0 0 8px #88D5E9;
    border: 1px solid #88D5E9;
}
</style>


<div class="MyDiv">
    <input type="text" name="username">
</div>