添加背景图片和边框图像形成

Question

我已经基于jQuery一个简单的形式 -

<center> 
    <form id="form1"> 
    <div id="registerDiv" data-role="fieldcontain" >  
    <input type="button" value="Register" id="registerButton" data-inline="true"/> 
    </div> 
    </form> 
    </center> 

我还想修改的形式，使得它有两个背景图片，一个背景覆盖在按钮（数字1 attachment - layout.png），第二个是作为边框的背景图片（attachment - layout.png中的数字2）。达到此目的的最佳方法是什么？

感谢

Answer 1

我认为你正在寻找一切是这样的：

#form1 { 
    background: url(/images/background1.jpg) no-repeat; 
} 

#registerDiv { 
    margin: 40px; 
    background: url(/images/background2.jpg) no-repeat; 
} 

Answer 2

CSS：

<style type="text/css"> 
    .outer {background:url(layout-outer.png);padding:12px} 
    .inner {background:url(layout-inner.png);padding:12px} 
</style> 

HTML：

<div class="outer"> 
    <form id="form1"> 
    <div class="inner"> 
     <!-- other input items as necessary --> 
     <input type="button" value="register" id="registerButton" data-inline="true" /> 
    </div> 
    </form> 
</div> 

的关键部分在这里是个 '.outer'中的填充量。这基本上是你的边框宽度。