不能使input:focus覆盖默认设置

Question

我试图使一个CSS样式的表单使用边框底部的样式，去一个绿色的盒子。但是，我看到input:focus语法不起作用，它显示了默认的焦点样式。谁能告诉我如何覆盖默认的焦点样式?谢谢你。

<style>
.input1{
border:0px;
border-bottom:1px solid #999999;
}
.input1:focus{
border:1px solid green;
}
</style>
<form action="">
<div>
<input class="input1" type="text" id="texto" >
</div>
</form>

Answer 1

实际上它工作，你错过了outline: none;

<style>
.input1{
border:0px;
border-bottom:1px solid #999999;
}
.input1:focus{
border:1px solid green;
outline: none;
}
</style>
<form action="">
<div>
<input class="input1" type="text" id="texto" >
</div>
</form>