[英]style a tag and input tag the same
我想给a
和input
设置相同的样式,但是在输入或类似内容周围有一种填充。 我该如何解决? 小提琴下面。
我正在使用Firefox
输出:
HTML:
<input type="button" value="lala" />
<a>lala</a>
CSS:
input{
padding: 0;
margin: 0;
margin-left: 30px;
border-spacing: none;
background: none;
box-shadow: none;
border: none;
float: left;
background-color: #005f83;
color: #fff;
font-family: Arial, sans-serif;
font-size: 12px;
box-sizing: content-box;
}
a{
margin-left: 30px;
font-family: Arial, sans-serif;
font-size: 12px;
float: left;
background-color: #005f83;
color: #fff;
box-sizing: content-box;
}
这个小提琴解释了我所有的猜测:
我尝试了很多,但是没有用。 我希望我的<input>
看起来与<a>
相同,而不是相反。 有解决方案吗?
除了光标以外,它们在我看来都一样。
为此,将cursor:pointer添加到'a'样式
遵循的安全做法是:
input{
padding: 0;
margin: 0;
margin-left: 30px;
border-spacing: none;
background: none;
box-shadow: none;
border: none;
}
a, input {
margin-left: 30px;
font-family: Arial, sans-serif;
font-size: 12px;
float: left;
background-color: #005f83;
color: #fff;
box-sizing: content-box;
cursor:pointer;
}
input::-moz-focus-inner {
padding: 0;
border: 0
}
添加它,它将删除Firefox中的内部填充和边框
input::-moz-focus-inner {
padding: 0;
border: 0;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.