CSS-滑动门技术

核心技术：利用css精灵（主要是背景位置）和盒子padding撑开宽度，以便能适应不用字数的导航栏。
1． 使用a设置背景左侧，并用padding-left撑开合适的宽度
2． span设置背景右侧，padding-right撑开合适的宽度，最好和上面的padding-left设置为同一个值，以实现文字左右居中的效果。
3． 使用a标签包含span就是因为整个导航都是可以点击的。

<a class="a">
      <span class="span">首页首页首页</span>
</a>

.a {
    display: inline-block;
    height: 33px;             /*不要设置宽度，宽度是用内容撑开的*/
    line-height: 33px;
    background: url(image/bgi.png) no-repeat;
    padding-left: 15px;
    color: #fff;
    text-decoration: none;    /*去除下划线*/
}

.span {
    display: inline-block;
    height: 33px;
    background: url(image/bgi.png) no-repeat right;    /*背景图像不平铺，右对齐*/
    padding-right: 15px;
}