代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
form{
width: 1000px;
max-width: 640px;
min-width: 320px;
margin: 0 auto;
font-family: "微软雅黑";
font-size: 20px;
}
input,meter,progress{
display: block;
width: 100%;
height: 30px;
margin: 10px 0;
}
</style>
</head>
<body>
<form action="">
<fieldset>
<legend>表单元素</legend>
<label for="">
用户名：<input type="text" name="username" />
</label>
<label for="">
密码：<input type="password" name="password" />
</label>
<label for="">
性别：<input type="text" name="sex" list="sex"/>
</label>
<!--定义数据列表-->
<datalist id="sex">
<option>男</option>
<option>女</option>
<option>未知</option>
</datalist>
<label for="">
推荐人：<output>作者</output>
</label><br /><br />
<label for="">
加密类型：
<****** />
<select>
<option>1</option>
<option>2</option>
</select>
</label><br /><br />
<label for="">
度量器：<meter value="90" max="100" min="0" low="30" high="80"></meter>
</label>
<progress value="90" max="100" min="0"></progress>
<input type="submit" value="提交"/>
</fieldset>
</form>
</body>
</html>