先来看张图片:
ok,看看代码吧。
CSS:
复制代码 代码如下:
*{margin:0;padding:0;}
body{padding:10px;font-size:12px;}
h1{margin:0;padding:10px0;font-size:14px;font-weight:bold;}
a{background:url(1.gif)left0;color:#fff;text-decoration:none;height:30px;float:left;cursor:hand;margin:05px00;}
a:hover{background:url(1.gif)left-30px;height:30px;}
aspan{background:url(1.gif)right0;padding:7px8px7px0;margin:0008px;float:left;height:16px;}
a:hoverspan{background:url(1.gif)right-30px;color:#000;padding:7px8px7px0;margin:0008px;height:16px;}
HTML:
复制代码 代码如下:
CSS自适应宽度圆角按钮@5key.net
演示:
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]