Question

我一直试图给按钮设置样式，我使用的代码是

#srchBtn
{
    width:120px;
    height:25px;
    vertical-align:middle;
    margin-top:10px;
    font-family:Tahoma;
    font-size:15px;
    border: 1px solid orange;
    background-color: red;
    color: white;
    text-shadow: 0 1px 1px black;
    padding: 5px 30px;
    border-radius: 4px;
    box-shadow: inset 0 1px 3px pink, inset 0 -5px 15px orange, 0 2px 1px black;
   -o-box-shadow: inset 0 1px 3px pink, inset 0 -5px 15px orange, 0 2px 1px black;
   -webkit-box-shadow: inset 0 1px 3px pink, inset 0 -5px 15px orange, 0 2px 1px black;
   -moz-box-shadow: inset 0 1px 3px pink, inset 0 -5px 15px orange, 0 2px 1px black;
}

但它会消除按钮的可点击属性，它就像一个图像。当我们尝试点击它时，它不像按钮那样......可能是什么错误？

Answer 1

只要更改按钮的外观，您还需要为伪类:active和:hover更改它以使工作作为普通按钮

也就是说，您的按钮实际上是一个按钮，但它不知道点击（:active）或鼠标悬停（:hover）时的样子。

#srchBtn:hover {
    /* your code here */
}

#srchBtn:active {
    /* your code here */
}

Answer 2

通过“像按钮一样行动”，你的意思是让它看起来像是可点击的吗？

最可能的原因是按钮没有活动（点击）状态。通常，未设置样式的按钮将具有其活动状态，由用户使用的浏览器设置样式。但由于您已经对按钮的几乎所有方面进行了设置，因此浏览器不会添加其他样式。

要添加您自己的活动（点击状态），请使用：

#srchBtn:active { }

您还可以使用以下方法添加其悬停状态：

#srchBtn:hover { }

Answer 3

这是你正在调用的javascript函数吗？如果是这样结帐，脚本会被加载到你的html页面，并尝试只有宽度和高度的小css属性，看看它的工作与否。

Answer 4

我将带走id元素，并使其成为一个类。以防您决定在页面上有多个按钮。然后，您可以保持网站上的所有按钮均匀直观。

.srchBtn{} //also include cursor:pointer

.srchBtn:hover{}

css样式问题，用于按钮

4 个答案: