如圖所示，在前端經常需要用到各種間隔符號，用CSS實現應該是最佳辦法，當然如果你用圖片、用符號都可以實現，但應用起來不如CSS來的那么順，那么爽！

今天就用CSS來制作這個間隔符，并且讓間隔符號垂直居中，并且高度低于前后文字，這樣顯得干練！

<style>
 *{font-size: 24px;}
 span{padding: 16px 6px 1px; margin-left: 12px; border-left: 2px solid;font-size: 0;}
</style>
注冊<span></span>登陸

實現的方法，就是默認使用了inline(span標簽就是行內，默認應該算是加了inline)，同時使用padding，來實現間隔符的高度！

如果不是span呢，而是div呢？那就加一個display:inline，再進行padding：

<style>
 *{font-size: 24px;}
 .fuhao{display: inline;padding: 16px 6px 1px; margin-left: 12px; border-left: 2px solid;font-size: 0;}
</style>
注冊<div class="fuhao"></div>登陸

一樣可以實現上圖的效果！