HTML 第三章: 表單 課後做業:

1.請用HTML5實現圖3.44所示的申請表表單。相關要求以下。
>教育程度:默認選中碩士。
>國籍:有美國,澳大利亞,日本,新加坡,默認選中澳大利亞。
>單擊文字相應的文本框獲得焦點。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>申請表</title>
</head>
<body>
      <h1><strong>申請表</strong></h1>
   <form action="" method="post">
       <p>姓名:
           <input name="name" type="text"/>
       </p>
       <p>教育程度:
           <input name="interest" type="checkbox" value="碩士"checked>碩士
           <input name="intterst" type="checkbox" value="博士">博士
       </p>
       <p>經常使用郵箱:
           <input type="email" name="email"/>
       </p>
               <!--<單選作法>-->
       <!--<p>性別:-->
           <!--<input name="gen" type="radio" value="男"checked>男-->
           <!--<input name="gen" type="radio" value="女">女-->
       <!--</p>-->
       <p>性別:
           <label for="nan" >男</label>
           <input type="radio" name="gender" id="nan"checked/>
           <label for="nv">女</label>
           <input type="radio" name="gender" id="nv"/>
       </p>
       <p>年齡:
           <input type="text" name="name"/>
        </p>
       <p>月薪:
           <input type="text" name="name"/>
       </p>
       <p>附註:
           <textarea name="textares" cols="40" rows="4">請在這裏鍵入附註
           </textarea>
       </p>
         國籍
        <select name="name">
            <option name="美國">美國</option>
            <option name="澳大利亞"selected>澳大利亞</option>
            <option name="日本">日本</option>
            <option name="新加坡">新加坡</option>
        </select>
       <p>
           <input type="submit" name="Button" value="提交"/>
           <input type="reset" name="Reset" value="重置"/>
       </p>
   </form>
</body>
</html>

2. 購買日期:"月" 下拉列表框爲1~12月,「日」下拉列表框爲1~31日。
   您是否查看過咱們的在線產品目錄:默認選中「是」。
   單擊文字相應的文件框獲得焦點。
   全部的表單元素不能爲空。
   使用placeholder屬性爲表單元添加提示文字。
   「重置」按鈕禁止操做。
   
 
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>電子產品調查問卷</title>
</head>
<body>
    <h2>American  Metric  電子產品調查問卷表 </h2>
    <form action="#" method="post"/>
    <p>姓名:
        <input type="text" placeholder=" 輸入必須是2-6位字符" required/>
        </p>
       <!--<多少年-->
     <p>購買日期:
        <select name="year">
           <option name="year "selected>2018</option >
        </select>年
         <!--<幾月>-->
      <select name="month">
          <option name="month">[請選擇月份]</option>
          <option name="month">一月</option>
          <option name="month">二月</option>
          <option name="month">三月</option>
          <option name="month">四月</option>
          <option name="month">五月</option>
          <option name="month">六月</option>
          <option name="month">七月</option>
          <option name="month">八月</option>
          <option name="month">九月</option>
          <option name="month">十月</option>
          <option name="month">十一月</option>
          <option name="month">十二月</option>
      </select>月
         <!--<日期>-->
      <select name="day">
          <option name="day">1</option>
          <option name="day">2</option>
          <option name="day">3</option>
          <option name="day">4</option>
          <option name="day">5</option>
          <option name="day">6</option>
          <option name="day">7</option>
          <option name="day">8</option>
          <option name="day">9</option>
          <option name="day">10</option>
          <option name="day">11</option>
          <option name="day">12</option>
          <option name="day">13</option>
          <option name="day">14</option>
          <option name="day">15</option>
          <option name="day">16</option>
          <option name="day">17</option>
          <option name="day">18</option>
          <option name="day">19</option>
          <option name="day">20</option>
          <option name="day">21</option>
          <option name="day">22</option>
          <option name="day">23</option>
          <option name="day">24</option>
          <option name="day">25</option>
          <option name="day">26</option>
          <option name="day">27</option>
          <option name="day">28</option>
          <option name="day">29</option>
          <option name="day">30</option>
          <option name="day">31</option>
      </select>日
      </p>
           <p>電子郵件地址:
               <input type="email" name="email" placeholder="www.baidu.com" required/>
           </p>
          <p>手機號碼:
              <input type="text" name="name" sizi="30" placeholder="輸入必須是以13/15/18開頭的11位數字" required/>
             </p>
        <p>您是否查看過咱們的在線產品目錄?
            <label for="shi" >是</label>
            <input type="radio" name="gender" id="shi"checked/>
            <label for="fou">否</label>
            <input type="radio" name="gender" id="fou"/>
             </p>
          <p>若是查看過,您對哪些產品有興趣購買?(選擇提供的產品)<br/>
              <input type="checkbox" id="dsj" />
              <label for="dsj">
                 大屏幕電視機
              </label>
              <input type="checkbox" id="yp"/>
              <label for="yp">
                  音頻設備
              </label>
              <input type="checkbox" id="sp"/>
              <label for="sp">
                  視頻設備
              </label>
              <input type="checkbox" id="xj"/>
              <label for="xj">
                  相機
              </label>
             </p>
         在填寫訂單以前,您還有什麼問題,意見或建議?<br/>
       <textarea  name="textarea" cols="40" rows="3">您的輸入:
           </textarea>
         <P>
             <input type="submit" name="Button" value="提交"/>
             <input type="reset" name="Reset" value="重置"disabled/>
         </P>
    </form>
  </body>
</html>