css實現文字加垂直豎線

方法一：直接在文字后面+“|”

 

方法二： border-right來實現（不可操作豎線高度）

    margin-right: 15px;
    padding-right: 15px;
    border-right: 1px solid #6598c7;

　　

方法三：偽類實現

.content {
      &:after {
           content: "";
           margin-left: 15px;
           padding-left: 15px;
           border-left: 1px solid #ccc;
           height: 12px;
           display: inline-block;
           vertical-align: middle;
       }
  }

　　

方法四：定位元素

.content {
	&:before {
	    content: "";
	    width: 1px;
	    height: 50%;
	    position: absolute;
	    top: 25%;
	    left: 0;
	    background: #ccc;
	}
}