html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1" name="viewport">
<title>
INns
</title>
<link href="E:\桌面\Html.T\style\Progres.css" rel="stylesheet" type="text/css"/>
</meta>
</meta>
</head>
<body>
<h1>
学生档案
</h1>
<form>
<p>
<h3>
姓名:
</h3>
<input name="name" placeholder="请输入姓名" size="20" type="text"/>
</p>
<p>
<h3>
手机号码:
</h3>
<input name="tel" placeholder="请输入手机号码" size="20" type="tel"/>
</p>
<p>
<h3>
邮箱地址:
</h3>
<input name="email" placeholder="请输入邮箱地址" size="20" type="email"/>
</p>
<p>
<h3>
所属学院:
</h3>
<select name="学院">
<option selected="selected" value="A1学院">
计算机科学与工程学院
</option>
<option value="A2学院">
马克思主义学院
</option>
<option value="A3学院">
应用技术学院
</option>
</select>
<p>
<h3>
入学成绩:
</h3>
<input name="grade" size="20" type="number"/>
</p>
<p>
<h3>
入学日期:
</h3>
<input name="date" size="20" type="date" value="年/月/日"/>
</p>
<p>
<h3>
毕业日期:
</h3>
<input id="Date" size="20" type="date"value="年/月/日"/>
</p>
<p>
<h3>
课程进度:
</h3>
<progress max="100" value="25">
</progress>
</p>
</p>
</form>
</body>
</html>
css:
progress {
display: inline-block;
width: 160px;
height: 20px;
border: 1px solid #767676;
background-color:#e6e6e6;
color: #7baaf7;
}
progress::-moz-progress-bar { background: #7baaf7; }
progress::-webkit-progress-bar { background: #e6e6e6; }
progress::-webkit-progress-value { background: #7baaf7; }
浙公网安备 33010602011771号