一张背景图的自适应按钮
其实很多时候都是用到自适应,用的最多的也就是导航,按钮的。根据实际字数需要,扩展或者缩小宽度。
hmtl代码:
<span>
<button>确定充值,去网银付款</button>
</span>
css代码:
span {
background:url(bg_comb.png) 100% 0;
height:32px;
display:inline-block;
padding:0 5px 0 0;
text-align:center;
font-size:14px !important;
vertical-align:middle;
width:auto;
}
button {
display:inline-block;
border:0;
background:url(bg_comb.png) 0 0;
height:32px;
line-height:30px;
padding:0 10px 5px 15px;
color:#fff;
vertical-align:middle;
white-space:nowrap;
overflow:visible;
}
其实我也是个懒人,这里不给出图片和预览了,如果又需要的。可以自己按照样式,亲自测试下。


















