当我在Firefox中选择选择框时,我得到一个虚线边框。我该如何删除它?看图像。
select.register {
-webkit-appearance: none;
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: '';
appearance: none;
font-size:14px;
display: inline-block;
height: 30px;
margin: 0;
padding: 5px 8px;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
select.register:focus{
outline: none;
border: 1px solid #ff00ff;
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
}
答案 0 :(得分:4)
将以下内容添加到CSS中,它应该修复它。
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #000;
}
答案 1 :(得分:1)
做这样的事情:
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
border: none;
}
您必须使用此伪选择器::-moz-focus-inner
,因为此边框是Firefox的“内部焦点样式”。