美文网首页
字体图标和文字垂直居中

字体图标和文字垂直居中

作者: 骚包霸天虎 | 来源:发表于2017-12-06 13:12 被阅读0次

字体图标使用iconfont字体图标库

1. stylus样式

            .lang
                flex 1
                float right
                height 50px
                line-height 50px
                color #fff
                i
                    font-size 30px
                    //***设置vertical-align进行调整
                    vertical-align -2px
                span
                    display inline-block
                    height 60px
                    line-height 5px

2. html样式

<div class="lang">
    <i class="icon iconfont icon-diqiuquanqiu"></i> <span> ENGLISH</span>
</div>
调整前 image.png
调整后 image.png

相关文章

  • 字体图标和文字垂直居中

    字体图标使用iconfont字体图标库 1. stylus样式 2. html样式

  • bootstrap使用

    1、图标与文字垂直居中对齐 1、图标与文字垂直居中对齐 参考 http://jsfiddle.net/Lv8px7...

  • 「CSS」文本

    字体改变字号改变字体加粗字体倾斜字体更改行距font shorthand改变文字颜色 对齐方式文字居中文本垂直对齐...

  • Android 自定义View学习(三)——Paint 绘制文字

    参考: Paint 绘制文字属性 1. 实现字体垂直居中 (1)x 轴居中: 利用measureText(Stri...

  • 开发中遇到的比较容易忽略的问题:

    1.文字在控件中垂直居中显示。(根据一个字体,计算出控件的大小,要求字体能够垂直居中显示。上下的距离都相等) 遇到...

  • iOS 深挖placeholder设置

    颜色 字体 水平居中 垂直居中placeholder在UITextField中的位置是以输入文字光标的上端点作为它...

  • CSS水平垂直居中总结

    CSS水平居中、垂直居中、水平垂直居中方法总结 文字的水平居中: 单行文字的垂直居中: 让有宽度的div水平居中:...

  • 垂直居中

    文字的垂直居中 元素的垂直居中

  • CSS居中大全(带截图)

    文字水平居中 图片水平垂直居中 图片与文字水平垂直居中 代码同上 DIV相对于页面垂直居中并且响应式 视口绝对垂直...

  • css居中各种实现

    垂直居中 多行文字垂直居中 利用flex布局 利用display: table;

网友评论

      本文标题:字体图标和文字垂直居中

      本文链接:https://www.haomeiwen.com/subject/vtikixtx.html