<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>定位说明示例</title>
    <style>
      form {
        width: 500px;
        margin: 0 auto;
      }

      fieldset {
        position: relative;
        margin-bottom: 20px;
      }

      legend {
        position: absolute;
        color: white;
        background-color: black;
        padding: 3px;
        bottom: 0;
        right: 0;
      }
    </style>
</head>
<body>
    <form>
        <fieldset>
          <legend>选择你爱吃的所有蔬菜：</legend>
          <ul>
            <li>
              <label for="carrots">胡萝卜</label>
              <input type="checkbox" checked id="carrots" name="carrots" value="胡萝卜">
            </li>
            <li>
              <label for="peas">豌豆</label>
              <input type="checkbox" id="peas" name="peas" value="豌豆">
            </li>
            <li>
              <label for="cabbage">圆白菜</label>
              <input type="checkbox" id="cabbage" name="cabbage" value="圆白菜">
            </li>
            <li>
              <label for="cauli">菜花</label>
              <input type="checkbox" id="cauli" name="cauli" value="菜花">
            </li>
            <li>
              <label for="broc">西兰花</label>
              <input type="checkbox" id="broc" name="broc" value="西兰花">
            </li>
          </ul>
        </fieldset>
        <fieldset>
          <legend>你最喜欢的料理是？</legend>
          <ul>
            <li>
              <label for="soup">汤</label>
              <input type="radio" checked id="soup" name="meal" value="汤">
            </li>
            <li>
              <label for="curry">咖喱饭</label>
              <input type="radio" id="curry" name="meal" value="咖喱饭">
            </li>
            <li>
              <label for="pizza">比萨饼</label>
              <input type="radio" id="pizza" name="meal" value="比萨饼">
            </li>
            <li>
              <label for="tacos">炸玉米饼</label>
              <input type="radio" id="tacos" name="meal" value="炸玉米饼">
            </li>
            <li>
              <label for="bolognaise">意大利面</label>
              <input type="radio" id="bolognaise" name="meal"  value="意大利面">
            </li>
          </ul>
        </fieldset>
    </form>
</body>

</html>
