已知div行高設置text-align:center文字會自動居中。
通過:before來設置icon的地址和高寬。
需要設置圖片默認的垂直居中條件，與文字一致，為text-bottom。
設置圖片行級顯示。
<!Doctype html>
<html>
<head>
<style>
body{margin:0;padding:0;}
.con{position:absolute;width:500px;height:50px;border:1px red solid;
line-height:50px;color:green;text-align:center;
}
.txt{font-size:20px;}
.txt:before{
content:'111';
background-image:url('icon.png');
background-size:20px 20px;
vertical-align:text-bottom;
display:inline-block;
width:20px;
height:20px;
border:0;
top:0;
left:0;
}
</style>
</head>
<body>
<div class="con">
<span class="txt">我是三哥四哥五哥一個字</span>
</div>
</body>
</html>
實際效果，圖標和文字會自動在div里中心居中
