我正在做一个网页,我想要定制的<button>
个标签.所以对于CSS,我说:border: none
.现在它在safari中运行得很好,但在chrome中,当我点击其中一个按钮时,它会在周围放置一个恼人的蓝色边框.我以为button:active { outline: none }
或button:focus { outline:none }
行得通,但两者都不行.有什么 idea 吗?
这是它在被点击之前的样子(以及我希望它在被点击后仍然是什么样子):
这就是我所说的边界:
以下是我的CSS:
button.launch {
background-color: #F9A300;
border: none;
height: 40px;
padding: 5px 15px;
color: #ffffff;
font-size: 16px;
font-weight: 300;
margin-top: 10px;
margin-right: 10px;
}
button.launch:hover {
cursor: pointer;
background-color: #FABD44;
}
button.change {
background-color: #F88F00;
border: none;
height: 40px;
padding: 5px 15px;
color: #ffffff;
font-size: 16px;
font-weight: 300;
margin-top: 10px;
margin-right: 10px;
}
button.change:hover {
cursor: pointer;
background-color: #F89900;
}
button:active {
outline: none;
border: none;
}