css google chrome 上的文本框边框

css textbox border on google chrome

我只想保留文本框的底部边框。这是我的 css-

    input[type="text"],input[type="password"] {          
        border:0px;
        border-bottom:1px solid black;
    }

    input[type="text"]:focus, input[type="password"]:focus {    
         border-bottom:2px solid green;                          
    }

这是它的样子-

在chrome-

在火狐上-

在 chrome 上,文本框在获得焦点时获得轮廓。有什么办法可以去除吗?

input[type="text"]:focus, input[type="password"]:focus {    
       outline:none;
     border-bottom:2px solid green;                          
}

你不见了outline:none。