spinbox HTML源码

界面效果:


HTML源码:

<span  style="font-family: 微软雅黑, 新宋体, 宋体; display: inline-block; white-space: nowrap; font-size: 12px; margin: 0px; padding: 0px; border: 1px solid rgb(164, 190, 212); width: 148px;"><input type="text" value="11" id="tbOrder" data-options="min:1" numberboxname="tbOrder" style="outline: none; height: 21px; border: 0px solid rgb(127, 157, 185); line-height: 21px; padding-top: 0px; padding-bottom: 0px; resize: none; text-indent: 3px; width: 130px;"><span  style="display: inline-block; vertical-align: top; margin: 0px; padding: 0px;"><span  style="display: block; font-size: 1px; width: 18px; height: 10px; background: url(data:image/gif;base64,R0lGODlhCQAFAIABAE1hhf///yH5BAEAAAEALAAAAAAJAAUAAAIMjAOnwIrcDHxpSlYAADs=) 5px 2px no-repeat rgb(224, 236, 249);"></span><span  style="display: block; font-size: 1px; width: 18px; height: 10px; background: url(data:image/gif;base64,R0lGODlhCQAFAIABAE1hhf///yH5BAEAAAEALAAAAAAJAAUAAAIMhIMGoXypFoJyJlsAADs=) 5px 3px no-repeat rgb(224, 236, 249);"></span></span></span>

这里全部使用行内样式,避免样式覆盖导致的变形错位等问题,背景图片使用Data Url编码,不再需要考虑图片存放位置的问题

注意:对代码格式化可能导致错位问题;


郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。