如何在离子图标上删除顶部和底部的间距?
我在我的html中使用它:
<div><i className="close ion-ios-close-empty" /></div>
这是所有离子的默认样式:
display:inline-block;
font-family:"Ionicons";
speak:none;
font-style:normal;
font-weight:normal;
font-variant:normal;
text-transform:none;
text-rendering:auto;
line-height:1;
font-size: inherit;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale
关闭课程如下:
.close{
color: #ffffff;
font-size: 50px;
}
我没有添加任何样式,我只增加了字体大小,但图标显示在照片上。
有没有办法去除顶部和底部的间距?
答案 0 :(得分:0)
稍后,但是我的解决方案是将行高设置为0.6 em:
.close{
color: #ffffff;
font-size: 50px;
line-height: 0.6em;
}
这更像是一种变通方法,但是如果您使用line-height属性玩一点,您将获得良好的结果。
提示:如果要选择阴影,请使用文本阴影而不是方框阴影。
答案 1 :(得分:-1)
use line height property
example : {
line-height: 1;
}