同一行文字字体大小不同，如何实现垂直居中
在写一些标题的时候想添加个置顶文字，就加了个span，但搞了半天，由于字体大小不一样，就是不居中。
下面是原来的代码片断。
1 2 3 4 | <h2 class="entry-title-top"> <span title="首页置顶" >置顶</span> <a href="#" rel="bookmark">中华民族的伟大复兴</a> </h2> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | .entry-title-top { line-height: 26px; height : 26px; } .entry-title-top a { color : #313131; } .entry-title-top span { background : rgb(230, 20, 90); color : #fff; font-size : 14px; padding : 0px 6px; border-radius : 3px; } |
后来通过一个简单的方法vertical-align: middle就解决了。就是给每个子窗口都添加vertical-align: middle来解决的。
修改后的效果是这样的
