制作效果：
制作模型：
/*公共类*/
.w {
/*版心 提取 */
1210px;
margin: 0 auto;
}
/*这里已经居中体现*/
.fl {
float: left
}
.fr {
float: right
}
.al {
text-align: left
}
.ac {
text-align: center
}
.ar {
text-align: right
}
.hide {
display: none
}
.site-nav{
height: 30px;
line-height: 30px;
background: #f1f1f1;
}
.site-nav-send{
position:relative;
padding:0 25px 0 10px;
/*background:red;*/
}
.site-nav-send:hover{
background-color: #fff;
}
.site-nav-send i{
position: absolute;
top:12px;
right:8px;
15px;
height: 7px;
overflow:hidden; //多余部分隐藏
/*background: yellow;*/
}
.site-nav-send s{
font:400 13px/15px "consolas";
position:absolute; //第二种办法： 不使用TOP ，display:block ; margin-top:-7px;
top:-8px;
}
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/index.css">
<link rel="icon" href="favicon.ico">
</head>
<body>
<div class="site-nav">
<div class="w">
<div class="fl">
<div class="site-nav-send">
送至：北京
<i><s>◇</s></i>
</div>
</div>
<div class="fr">
abcc
</div>
</div>
</div>
</div>
</body>