html中弧形按钮,CSS漂亮的弧形按钮菜单

按钮菜单

a.ovalbutton{

background: transparent url('http://p1.mb5u.com/texiao/oval-gray-left.gif') no-repeat top left;

display: block;

float: left;

font: normal 13px Tahoma;

line-height: 16px;

height: 24px;

padding-left: 11px;

text-decoration: none;

}

a:link.ovalbutton, a:visited.ovalbutton, a:active.ovalbutton{

color: #494949; }

a.ovalbutton span{

background: transparent url('http://p1.mb5u.com/texiao/oval-gray-right.gif') no-repeat top right;

display: block;

padding: 4px 11px 4px 0;

}

a.ovalbutton:hover{

background-position: bottom left;

}

a.ovalbutton:hover span{

background-position: bottom right;

color: black;

}

.buttonwrapper{

overflow: hidden;

width: 100%;

}

Single button:

Dynamic Drive CSS Library

Side by Side:

Submit Welcome