我有这个并且需要相同的样式用于 input type="submit"
或 "button"
。是否可以?如果是,怎么办?
提前致谢
a.dlbtn {
display: inline-block;
position: relative;
height: 30px;
line-height: 30px;
overflow: hidden;
padding: 0 20px;
font-size: 12px;
font-weight: bold;
color: #dfdfdf;
background-color: #4b4b4b;
}
a.dlbtn:hover,
a.dlbtn:focus {
color: #fff;
padding-right: 90px;
background-color: #5381bf;
border-color: #5381bf;
}
<a href="" class="dlbtn">Descarga<span class="details">.iso<span class="size">2.9 gb</span></span></a>
最佳答案
想象一个带有 dlbtn
的按钮和输入元素类:
<input class="dlbtn" type="submit" value="Submit">
<button class="dlbtn" type="submit">Submit</button>
现在,您的 dlbtn
类仅限于 a
标签(这样,即使在上面的元素上设置了类,它也不会被应用):
a.dlbtn {[...]}
a.dlbtn:hover {[...]}
a.dlbtn:focus {[...]}
您可以向 css 选择器添加额外的 html 标记,允许类声明应用于 a
, input
和 button
带有 dlbtn
的 html 标签类集:
a.dlbtn, input.dlbtn, button.dlbtn {[...]}
a.dlbtn:hover, input.dlbtn:hover, button.dlbtn:hover {[...]}
a.dlbtn:focus, input.dlbtn:focus, button.dlbtn:focus {[...]}
或者您可以删除 html 标签限制并将该类应用到具有“dlbtn”类的任何 html 元素(如 <div class="dlbtn">[...]</div>
):
.dlbtn {[...]}
.dlbtn:hover {[...]}
.dlbtn:focus {[...]}
只是警告你,两个input
和 button
带有浏览器提供的标准样式。您可能会在 StackOverflow 上找到另一个关于覆盖标准样式的方法的答案(例如使用 -webkit-appearance:none
来处理 Chrome 的一些输入元素自动样式)。
编辑:更新<button>
键入阅读每个 Leo Farmer 的“提交”。
关于html - 如何从 href 生成输入类型 ="submit"?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28975381/