我是CSS新手。标记按钮具有以下样式。如何减少按钮的高度?我尝试更改它,但没有帮助。
我的代码:
.tag-btn {
font-size: 10px;
text-transform: uppercase;
font-weight: bold;
color: #fff;
cursor: pointer;
z-index: 5;
position: relative;
padding: 10px;
line-height: 13px;
margin: 0;
height: 40px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
background-color: #F08080;
border: none;
color: #fff;
box-shadow: none;
}
有人可以帮我吗?谢谢。
最佳答案
完全删除height
并尝试调整line-height
.tag-btn {
font-size: 10px;
text-transform: uppercase;
font-weight: bold;
color: #fff;
cursor: pointer;
z-index: 5;
position: relative;
padding: 10px;
margin: 0;
line-height: 5px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
background-color: #F08080;
border: none;
color: #fff;
box-shadow: none;
}
DEMO
关于css - 如何使用CSS减少按钮的高度?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/30049041/