/*
按钮样式
适用于input, button, a, span, div
*/
.s_button:visited,
.s_button {
padding:2px 6px;
margin:0;
border:1px solid #ccc;
background:url(../img/btns.png) repeat-x 0 0;
line-height:18px;
height:18px;
font-size:14px;
display: inline-block;
vertical-align: top;
text-decoration: none;
cursor: pointer;
color:#000;
*overflow: visible;
font-family:'Arial';
-moz-box-sizing:content-box;
box-sizing:content-box;
border-radius: 2px;
}
.s_button:hover {
text-decoration: none;
color:#000;
border:1px solid #aaa;
background:url(../img/btns.png) repeat-x 0 -100px;
}
.s_button:active {
border:1px solid #888;
background:url(../img/btns.png) repeat-x 0 -200px;
}
input.s_button,
button.s_button {
+height:24px;
_line-height:19px;
*padding:0 6px;
}
div.s_button {
*display: inline;
*margin-right:4px; /* 模拟inline-block的间隙 */
}
<button class="s_button" type="button">提交</button>
<input type="submit" class="s_button" value="提交" />
<a href="#" class="s_button">提交</a>
<span class="s_button">提交</span>
<div class="s_button">提交</div>
<button class="s_button" type="button">submit</button>
<input type="submit" class="s_button" value="submit" />
<a href="#" class="s_button">submit</a>
<span class="s_button">submit</span>
<div class="s_button">submit</div>