在css2.0时代,有很多效果没法用用css直接实现,比如圆角导航栏。为了实现这个效果,人们用到了滑动门。
我们使用a和span两个标签来说明滑动门。
<a href="#">
<span>Tab</span>
</a>
我们有两张图片,a.png是左上角是圆角,其他角是直角,b.png是右上角是圆角,其他角是直角。
则css如下:
a{background:url(a.png) left top;background-repeat:no-repeat;}
span{background:url(b.png) right top;}
随着span中的内容增加,span可以a标签里面滑动。从而实现了滑动门。