设计滑动门样式

HTML

<a  href="#"><span>按钮</span></a>
<a  href="#"><span>超链接</span></a>
<a  href="#"><span>图像按钮</span></a>
<a  href="#"><span>扩展性按钮</span></a>
<a  href="#"><span>能够定义很多字数的文本链接</span></a>
					    

CSS

a {
    background: url('images/left1.gif') no-repeat top left;
    display: block;
    float: left;
    padding-left: 8px;
    font: bold 13px Arial;
    line-height: 22px;
    height: 30px;
    color: white;
    margin-left: 6px;
    text-decoration: none;
}
a span {
    background: url('images/right1.gif') no-repeat top right;
    display: block;
    padding: 4px 10px 4px 2px;
}
a:hover { text-decoration: underline; }