Html 奇怪的css焦点错误

我发现这个例子，因为这种风格很好，所以我插入了我的项目
以下示例是

html

&

css

仅在chrome、safari中出现错误 在firefox中运行良好 当我在搜索框上单击（聚焦）时，它的样式为，但单击时会出现一条蓝色边框线，我不想要蓝色边框，当我单击输入框时，我尝试移除阴影，但仍然没有成功

.wrap{位置：绝对；
文本对齐：居中；
最高：50%；
-webkit转换：翻译（0%，-50%）；
-moz变换：平移（0%，-50%）；
转换：转换（0%，-50%）；}
.se{
左边距：50像素；
}
#搜索输入[type=“text”]{
背景：url（search white.png）无重复10px 6px#444；
边界：0无；
字体：粗体12px Arial，Helvetica，无衬线；
颜色：#d7d7d7；
宽度：150px；
填充：6px 15px 6px 35px；
-webkit边界半径：20px；
-moz边界半径：20px；
边界半径：20px；
文本阴影：02px2pRGBA（0,0,0,0.3）；
-webkit盒阴影：0 1px 0 rgba（255，255，255，0.1），0 1px 3px rgba（0，0，0.2）插入；
-moz盒阴影：0 1px 0 rgba（255，255，255，0.1），0 1px 3px rgba（0，0，0.2）插入；
框阴影：0 1px 0 rgba（255，255，255，0.1），0 1px 3px rgba（0，0，0.2）插入；
-webkit转换：所有0.7秒到0秒；
-moz转换：所有0.7秒都是0秒；
-o型过渡：所有0.7秒变为0秒；
过渡：所有0.7秒到0秒；
}
#搜索输入[type=“text”]：焦点{
背景：url（search dark.png）无重复10px 6px#fcfc；
颜色：#6a6f75；
宽度：200px；
-webkit盒阴影：0 1px 0 rgba（255，255，255，0.1），0 1px 0 rgba（0，0，0.5）插入；
-moz盒阴影：0 1px 0 rgba（255，255，255，0.1），0 1px 0 rgba（0，0，0.5）插入；
框阴影：0 1px 0 rgba（255，255，255，0.1），0 1px 0 rgba（0，0，0，0.5）插入；
文本阴影：0 2px 3px rgba（0,0,0,0.1）；
}

---

在输入上设置

大纲：无

，以删除chrome的输入突出显示

#search input[type="text"]{
   outline: none;
}

关于搜索输入[type=“text”]的提纲：聚焦或

#搜索输入[type=“text”]