HTML 表单：和用户交互

表单是用来实现用户与网站交互的。

一个表单是以开始标签<form>开始，以结束标签</form>结尾的。

form元素是一种特殊的容器，它包含的许多XHTML元素只能出现在form元素中的，例如：

fieldset

legend

input

textarea

select

fieldset元素能够将表单中的相关元素设置成组（在它们周围用线圈起来），而legend元素则是用来为这样的元素组设置标题。

一个例子如下：

HTML代码如下：

<form method="get" action="nested.html">
      <fieldset>
        <legend>Personal Details</legend>
        <fieldset>
          <legend>Address Details</legend>
            <p>
              <label for="city">City:</label>
              <input type="text" name="city" id="city"/>
            </p>
            <p>
              <label for="yourname">Zip Code:</label>
              <input type="text" name="address" id="yourname"/>
            </p>
        </fieldset>
        <fieldset>
          <legend>Telephone Details</legend>
            <p>
              <label for="city">Home:</label>
              <input type="text" name="city" id="city"/>
            </p>
            <p>
              <label for="yourname">Mobile:</label>
              <input type="text" name="address" id="yourname"/>
            </p>
        </fieldset>
      </fieldset>
      <p><input type="submit" id="submit"/></p>
    </form>

CSS代码如下：

fieldset fieldset {
        width: 45%;
        float: left;
      }
      #submit {
        margin-bottom: 10px;
        float: right;
      }