<!DOCTYPE html>
<form action="" method="get" class="form-example">
<div class="form-example">
<label for="name">Enter your name: </label>
<input type="text" name="name" id="name" required>
</div>
<div class="form-example">
<label for="email">Enter your email: </label>
<input type="email" name="email" id="email" required>
</div>
<div class="form-example">v
</div>
</form>
<form name="form1" > 性别<br>
<input type="radio" name="radiobutton" value="radiobutton" checked> 男
<input type="radio" name="radiobutton" value="radiobutton"> 女
<form>
<fieldset>
<legend>爱好</legend>
<div>
<input type="radio" id="吃"
name="drone" value="chi" checked />
<label for="吃">吃</label>
</div>
<div>
<input type="radio" id="玩"
name="drone" value="玩" />
<label for="玩">玩</label>
</div>
<div>
<input type="radio" id="学习"
name="drone" value="学习" />
<label for="学习">学习</label>
</div>
</fieldset>
</form>
<fieldset>
<legend>年龄段</legend>
<div>
<input type="checkbox" id="1-20" name="feature"
value="1-20" checked />
<label for="1-20">1-20</label>
</div>
<div>
<input type="checkbox" id="20-50" name="feature"
value="20-50" />
<label for="20-50">20-50</label>
</div>
<div>
<input type="checkbox" id="50+" name="feature"
value="50+" />
<label for="50+">50+</label>
</div>
</fieldset>
<fieldset>
<legend>Course registration</legend>
<label for="name">Course name</label>
<select id="name">
<option value="flower">Flower taming</option>
<option value="lion">Lion arranging</option>
</select>
<label for="start">Start month</label>
<input type="month" id="start" name="start"
min="2018-03" value="2018-05" />
<span class="validity"></span>
</fieldset>
<fieldset>
<legend>Choose some monster colors</legend>
<div>
<input type="color" id="head" name="color"
value="#e66465" />
<label for="head">Head</label>
</div>
<div>
<input type="color" id="body" name="color"
value="#f6b73c" />
<label for="body">Body</label>
</div>
<div>
<input type="color" id="feet" name="color"
value="#3f87a6" />
<label for="feet">Feet</label>
</div>
<input type="submit" value="提交!">
</fieldset>