批改状态:合格
老师批语:
效果图
<!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>Document</title><style>body {background-color: rgb(201, 225, 245);}main {width: 28%;margin-left: 42%;font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;}form,h3 {text-align: left;}h3 {margin-left: 90px;}span {color: red;}input {margin-top: 10px;}label.countInfo {display: inline-block;width: 100px;}label.contactInfo {display: inline-block;width: 100px;}label.contactInfo {display: inline-block;width: 100px;}label.QQ {display: inline-block;width: 107px;}p {font-style: italic;font-weight: 600;}div.hobby {margin-top: 10px;margin-bottom: 10px;}div.slogan {margin-top: 10px;}div.slogan label {display: inline-block;vertical-align: top;}button {width: 100px;background-color: rgb(200, 229, 238);border: 1px solid #666666;border-radius: 5px;margin-left: 25%;}</style></head><body><main><h3>用户注册</h3><form action="" method="get"><!-- 账号 --><p>账号信息</p><div><span>*</span><label for="username" class="countInfo"> 账号: </label><inputtype="text"id="username"autofocusplaceholder="8-16位"required/></div><div><span>*</span><label for="psw" class="countInfo"> 密码: </label><inputtype="password"id="psw"placeholder="请使用复杂密码"required/></div><div><span>*</span><label for="conf" class="countInfo">确认密码:</label><inputtype="password"id="conf"placeholder="请再次输入密码"required/></div><br /><br /><!-- 联系信息 --><p>联系信息</p><div><span>*</span><label for="phonenum" class="contactInfo"> 手机: </label><inputtype="text"id="phonenum"requiredplaceholder="请输入11位手机号"/></div><div><span>*</span><label for="email" class="contactInfo"> 邮箱: </label><inputtype="email"id="email"requiredplaceholder="用于找回密码接收重要信息"/></div><div><label for="QQ" class="contactInfo QQ"> QQ: </label><input type="text" id="QQ" /></div><div><span>*</span><label for="address" class="contactInfo"> 联系地址: </label><input type="text" id="address" required /></div><br /><br /><!-- 补充信息 --><p>个人资料</p><label for="secret">性别:</label><input type="radio" name="gender" value="male" />男<input type="radio" name="gender" value="female" />女<inputtype="radio"name="gender"value="secret"id="secret"checked/>保密<div class="hobby"><label for="">兴趣爱好:</label><br /><input type="checkbox" name="hobby[]" id="read" checked /><label for="read">看小说</label><input type="checkbox" name="hobby[]" id="write" /><label for="write">写小说</label><input type="checkbox" name="hobby[]" id="watch" /><label for="watch">看电视</label><input type="checkbox" name="hobby[]" id="playBall" /><label for="playBall">打球</label></div><div><label for="home">籍贯:</label><select name="home" id="home"><option value="hunan">湖南</option><option value="hubei">湖北</option><option value="guangdong">广东</option><option value="guangxi">广西</option><option value="henan">河南</option><option value="hebei">河北</option><option value="shandong">山东</option><option value="jiangxi">江西</option></select></div><div><label for="search">感兴趣的领域:</label><input type="search" id="search" name="search" list="keywords" /><datalist id="keywords"><option value="电竞"></option><option value="历史"></option><option value="国际"></option><option value="美女"></option></datalist></div><div class="slogan"><label for="slogan">个性签名</label><textarea name="slogan" id="slogan" cols="30" rows="10"></textarea></div><br /><button type="submit">注册</button></form></main></body></html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号