safari textfield背景颜色不会改变

Question

#searchInput {
    width: 82px;
    height: 40px;
    margin: 0;
    border: 0;
    position: relative;
    top: -273px;
    left: -205px;
    color: #FF7F27;
    font-size: 85%;
    background: transparent;

}

上面的代码不会在safari中将textfied背景颜色变为透明。我尝试了不透明度，但这只是使文本和字体同时消失。这个问题发生在我测试的其他浏览器中。

Answer 1

您需要删除默认样式并允许新的css属性，因此您需要更改-webkit-appearance属性。

  #searchInput {
              width: 82px;
              height: 40px;
              margin: 0;
              border: 0;
              position: relative;
              top: -273px;
              left: -205px;
              color: #FF7F27;
              font-size: 85%;
              background: transparent;
              -webkit-appearance: none;/* this should Work */
             }

Answer 2

尝试generating a transparent background然后使用该网址上生成的代码应用它，例如：

#searchInput
{
  background: -webkit-linear-gradient(top, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0) 100%);
}