我想为 <button>
设置样式和 <a>
元素都转换成相同的格式。我使用以下代码:
button,
a {
border: solid 1px black;
background-color: white;
color: black;
font-family: 'Arial';
padding: 0 15px;
font-size: 13px;
height: 35px;
line-height: 35px;
display: inline-block;
}
#dummy-block {
background-color: black;
padding: 0;
margin: 0;
height: 20px;
}
<div id="dummy-block"></div>
<button>My Button</button>
<a>My Link</a>
但是 <button>
元素似乎忽略了高度和我的 <a>
元素不接触黑色假人的边缘<div>
以上:
你可以测试我的 fiddle 中的代码:http://jsfiddle.net/gyrrcrqc/1/
最佳答案
试试这个:-
button, a {
background-color: white;
border: medium none;
box-shadow: 0 0 1px #000 inset;
color: black;
display: inline-block;
font-family: "Arial";
font-size: 13px;
height: 35px;
line-height: 35px;
padding: 0 15px;
vertical-align: top;
}
或者:-
button, a {
background-color: white;
border: medium none;
vertical-align:top;
color: black;
display: inline-block;
font-family: "Arial";
font-size: 13px;
height: 35px;
line-height: 35px;
padding: 0 15px;
border:1px solid #000;
box-sizing:border-box
}
关于html - a 元素和按钮元素的垂直位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26907460/