我正在使用Safari浏览器,并且有类似这样的按钮-
悬停时,这些外观如下-
我没有添加任何CSS,但是在inspect元素上却得到了此-
button:hover {
box-shadow: 0px 0px 1px #b2b2b2;
border-left-color: #575757;
border-right-color: #575757;
}
我想使它在悬停时看起来一样或不悬停。所以我尝试将css设置为-
button:hover {
box-shadow: none;
border-left-color: none;
border-right-color: none;
}
但是它不起作用。
您可以使用此代码
button {
box-shadow: 0px 0px 1px #b2b2b2;
background-color: #ffffff;
border: 1px solid #575757;;
outline: none;
padding: 15px 30px;
text-decoration: none;
border-radius: 15px;
font-size: 25px;
font-weight: 600;
color: #333333;
}
button:hover {
box-shadow: 0px 0px 1px #b2b2b2;
background-color: blue;
border: 1px solid #575757;;
outline: none;
padding: 15px 30px;
text-decoration: none;
color: white;
}
<button type="button">Prev</button>
<button type="button">1</button>
<button type="button">2</button>
<button type="button">3</button>
<button type="button">Next</button>