css - 如何让<input>（type为button），<button>和<a>表现的一致的（大小等）

问题描述

问 题

如何让<input>（type为button），<button>和表现的一致的（大小等）

比如说我写了一个class，给这几个标签使用。

但是表现的不一样啊，请问该怎么解决呢，以下是我的代码

.info-button {
    background-color: #1ba2f4;
    border-radius: 4px;
    border: none;
    padding: 6px 8px;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
    margin: 0px;
    line-height: normal;
    box-sizing: border-box;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
}

在 Safari 下面的表现：

然后在 Chrome 下居然是这样的：

左边是 input 右边是 a

先谢谢大家的解答了！

解决方案

再试了一下，发现再加上一个 font-family 的属性就表现得一致了。

这篇关于css - 如何让&lt;input&gt;（type为button），&lt;button&gt;和&lt;a&gt;表现的一致的（大小等）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！