使用css实现滑动门效果的制作

  一般在页面的导航栏部分使用滑动门技术，此做法的优点在于不管里面的文字有多少，都可以实现自由伸缩，不影响外观。其做法如下：

在css里面设置的样式:

         a {
                display: inline-block;
                height: 33px;
                background: url(images/to.png) no-repeat;
                padding-left: 15px;
                line-height: 33px;
            }
            a span {
                display: inline-block;
                height: 33px;
                padding-right: 15px;
                background: url(images/to.png) right top no-repeat;

html结构中的写法：

               <a href="#">
                    <span>文字</span>
                </a>