Css “如何设计风格”；提交；在鼠标上方输入，单击？

我需要设置两种不同的输入样式，使其在鼠标上方和单击时显示不同，就像按钮一样。通常我会使用按钮；但是，其中一个是输入type=“reset”，我认为使用输入比编写表单重置脚本更简单。

---

“一种样式”如何使用CSS输入“提交”和“重置”类型以进行鼠标悬停和单击？

这与CSS中的任何其他元素相同，有用于悬停和聚焦的psuedo选择器，但不专门用于单击。也可以使用属性选择器：

input[type="reset"]{/* attribute selector*/}
input[type="reset"]:hover{/* :hover psuedo selector*/}
input[type="reset"]:focus{/* :focus psuedo selector*/}
input[type="reset"]:active{/* :active psuedo selector (for click)*/}

---

焦点样式将在用户最初单击时应用（当然是聚焦），但一旦用户将焦点移动到另一个元素，该样式将丢失。要在鼠标按钮按下的那一瞬间获得特定的点击样式，请使用javascript或尝试

：active

选择器，该选择器（我刚刚意识到）可以应用于非锚元素。

假设您指的是CSS，而不是javascript方法，您可以使用伪类：

input[type=reset], /* CSS2.1 attribute-equals selector */
#resetButtonID,
.resetButtonClass-Name {
    /* the reset button */
}

input[type=reset]:hover,
#resetButtonID:hover,
.resetButtonClass-Name:hover {
    /* the reset button when hovered over */
}

input[type=reset]:active,
#resetButtonID:active,
.resetButtonClass-Name:active {
    /* the reset button when mouse-down */
}

input[type=reset]:focus,
#resetButtonID:focus,
.resetButtonClass-Name:focus {
    /* the reset button when focussed by keyboard-navigation */
}