Correcting teacher:天蓬老师
Correction status:qualified
Teacher's comments:
<!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>
</head>
<body>
<h3>用户注册</h3>
<form
action=""
method="get"
style="display: grid"
style="display: grid; gap: 0.5em"
onsubmit="return false;"
>
<fieldset>
<legend>必填项</legend>
<div>
<label for="username">账号:</label>
<input
type="text"
id="username"
name="username"
autofocus
required
placeholder="不少于8位"
value="username"
/>
</div>
<div>
<label for="psw">密码:</label>
<input type="password" id="psw" name="psw" />
</div>
<div>
<label for="email">邮箱:</label>
<input type="email" id="email" name="email" />
</div>
</fieldset>
<div>
<label for="xinbie">xinbie:</label>
<input type="radio" name="man" value="male" />
<label for="">man</label>
<input type="radio" name="female" value="male" />
<label for="">nv</label>
</div>
<div>
<label for="aihao">aihao</label>
<input type="checkbox" name="hobby[]" id="pingpang" /><label for=""
>pingpang</label
>
<input type="checkbox" name="hobby[]" id="lanqiu" /><label for=""
>lanqiu</label
>
</div>
<!-- xialakuang -->
<div>
<label for="level">xuaznhuiyuan:</label>
<select name="level" id="">
<option value="1">jinpai</option>
<option value="2" selected>yinpai</option>
<option value="3">tongpai</option>
</select>
</div>
<div>
<label for="">sousuo:</label>
<input type="search" name="search" />
<datalist>
<option value="html"></option>
</datalist>
</div>
<button>sub</button>
</form>
</body>
</html>
<!-- 标签:labal,input,form,
属性:type:redio,type:text,type:password,type:checkbox
ru guo wo shi checkbox,name:hobby[] -->
效果图如下
<!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>
</head>
<body>
<div class="aa1">
<p id="today">today is a good day</p>
<div class="aa2">
<ul>
<li>1</li>
<li>2</li>
</ul>
</div>
</div>
<style>
/* * {
background-color: yellow;
} */
.aa1 {
width: 100px;
height: 50px;
}
#today {
color: red;
}
p {
font-size: 20px;
}
p,
li {
background-color: aqua;
}
</style>
</body>
</html>
效果如下