使用CSS在Web窗体上的某些控件周围创build一个组框
我在三个下拉列表的Web表单上有三个控件。
我想围绕这些控件创build一个graphics“框”。 原因是select这些控件将是我的过程的“第一步”。 所以我想围绕这些控件放一个盒子，称之为“第一步”
我将如何去做这个与CSS？
例：
带有legend的fieldset为表单控件提供了视觉和语义分组。 然后，您可以根据需要用CSS来设置它的样式。 fieldset有点独特之处在于， legend能够可视地中断其父fieldset的边界（可能与其他元素，但是很难）。
例如： http : //jsfiddle.net/NUMcr/1/
<fieldset> <legend>Group 1</legend> <input type="text" /> <asp:Textbox runat="Server" id="txt1" /> <!-- etc --> </fieldset>
fieldset { margin: 8px; border: 1px solid silver; padding: 8px; border-radius: 4px; } legend { padding: 2px; }
有一个fieldset HTML元素，它是为了这个特定的目的而创build的： http : //www.w3.org/wiki/HTML/Elements/fieldset 。 如果你只使用CSS，你可以做这样的事情：
<html> <head></head> <body> <h1>Step 1</h1> <div style="border: 1px solid #000000;"> <input type="text" /> <input type="submit" value="Submit" /> </div> </body> </html>
然后，您可以设置h1 （或您希望用于标题的任何types的HTML元素）和包含input元素的div 。
<form> <fieldset> <legend>Personalia:</legend> Name: <input type="text"><br> Email: <input type="text"><br> Date of birth: <input type="text"> </fieldset> </form>
