亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

搜索

微信公眾號

首頁文章專題 AI工具學習編程手冊下載最近更新

文章 web3.0 后端開發(fā) web前端數(shù)據(jù)庫開發(fā)工具 php框架常見問題科技 Java 系統(tǒng)教程電腦教程硬件教程手機教程軟件教程游戲教程自媒體新聞

專題后端開發(fā) web前端數(shù)據(jù)庫開發(fā)工具 php框架科技 Java 系統(tǒng)教程電腦教程硬件教程手機教程軟件教程游戲教程新聞

AI工具 AI 聊天問答 Agent智能體 AI 文本寫作 AI 繪畫作圖 AI 設(shè)計工具 AI 視頻創(chuàng)作 AI 音頻制作 AI 辦公學習 AI 編程開發(fā) Prompt指令

學習大前端后端開發(fā) 數(shù)據(jù)庫移動端運維開發(fā) UI設(shè)計計算機基礎(chǔ)

編程手冊大前端 JavaScript 后端開發(fā) 數(shù)據(jù)庫移動端運維開發(fā) UI設(shè)計計算機基礎(chǔ) XML Web Services

下載 js特效網(wǎng)站源碼工具下載類庫下載網(wǎng)站素材學習資源插件擴展手機/移動開發(fā) 手機游戲

代碼

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>表單</title>
  <style>
    form div {
      margin: 10px 0;
    }
  </style>
</head>
<body>
  <div class="content" style="margin: 5px auto; width: 1000px;">
    <div class="main" style="margin: 0 auto; width: 800px;">
      <h2 class="title" style="text-align: center;">用戶注冊</h2>
      <form action="index.php" method="POST" enctype="multipart/form-data" target="_blank" id="register">
        <fieldset>
          <legend>賬號信息</legend>
          <div class="username">
            <label for="username">賬號名稱</label>
            <input id="username" type="text" name="username" placeholder="請輸入用戶名" required>
          </div>
          <div class="password">
            <label for="password">用戶密碼</label>
            <input id="password" type="password" name="password" value="123" placeholder="請輸入密碼" required>
            </br>
            <progress name="safe" max="10" min="0" value="3"></progress>
            <output>密碼安全程度：<span style="color: red;">較弱</span></output>
          </div>
          <div class="repassword">
            <label for="repassword">確認密碼</label>
            <input id="repassword" type="password" name="repassword" value="123" placeholder="請確認密碼" required>
          </div>
          <div class="upload" style="margin: 10px 0;">
            <label for="upload">頭像</label>
            <input id="upload" type="file" name="upload">
            <button type="button">上傳</button>
          </div>
        </fieldset>
        <fieldset>
          <legend>用戶信息</legend>
          <div class="gender">
            <label for="secret">性別:</label>
            <input type="radio" name="gender" value="male" id="male"><label for="male">男</label>
            <input type="radio" name="gender" value="female" id="female" ><label for="female">女</label>
            <input type="radio" name="gender" value="secret" id="secret" checked><label for="secret">保密</label>
          </div>
          <div class="birthday">
            <label for="birthday">生日:</label>
            <input type="date" name="birthday" value="2022-10-18" id="birthday" min="1949-10-01" max="2000-01-01" />
          </div>
          <div class="phone">
            <label for="phone">手機號</label>
            <select name="phone" id="edu" form="">
              <option value="0" selected>+86</option>
              <optgroup label="美洲">
                 <option value="1">+90</option>
              <option value="2">+99</option>
              <option value="3">+88</option>
              </optgroup>
             <optgroup label="歐洲">
               <option value="4">+10</option>
              <option value="5">+68</option>
             </optgroup>
            </select>
            <input id="phone" type="number" placeholder="請輸入手機號">
          </div>
          <div class="email">
            <label for="email">郵箱</label>
            <input id="email" type="email" name="email" placeholder="user@php.cn" required>
          </div>
          <div class="color">
            <label for="color">喜歡的顏色</label>
            <input id="color" type="color" name="color" value="#FFFF00">
          </div>
          <div class="like">
            <label for="keyword">想要學習的語言</label>
            <input type="search" name="language" list="details" id="keyword">
            <datalist id="details">
              <option value="Java">Java</option>
              <option value="C++">C++</option>
               <option value="Go">Go</option>
              <option value="Python">Python</option>
              <option value="Js">Js</option>
            </datalist>
          </div>
          <div>
            <label for="comment">個人簡介</label>
            <textarea placeholder="介紹自己，讓別人更好地認識你，800字以內(nèi)。" name="comment" id="comment" cols="30" rows="5" maxlength="200" style="resize: none"></textarea>
          </div>
        </fieldset>
        <div class="agree">
          <input type="checkbox" name="agree" value="agree" id="agree" checked><label for="program">已經(jīng)閱讀并同意</label><a style="text-decoration: none" href="http://www.baidu.com"><span style="color: red;">用戶服務(wù)協(xié)議</span></a>
        </div>
        <div class="agree">
          <input type="checkbox" name="agree" value="agree" id="agree" checked><label for="program">允許向我的郵箱發(fā)送郵件</label>
        </div>
        <div style="text-align:center">
          <button type="button" style="display: inline-block; margin: 15px; height: 40px; width: 80px;">重置</button>
          <button type="button" style="display: inline-block; margin: 15px; height: 40px; width: 80px;">確認注冊</button>
        </div>
      </form>
    </div>
  </div>
</body>
</html>