摘要：<!DOCTYPE html> <html lang = "en"> <head> <meta charset = "UTF-8"> <ti
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title>特价商品抢购</title>
</head>
<style>
div {
font-size: 16px;
font-family: 微软雅黑, 黑体, mono, monospace;
width: 300px;
margin: 10px auto;
}
p {
font-weight: bold;
color: #0bbc4e;
text-align: center;
}
.input-group {
width: 280px;
height: 25px;
margin-bottom: 10px;
padding: 5px;
}
button {
color: #FFF;
width: 300px;
height: 35px;
margin: 15px 0;
background: #2ca02c;
border: none;
}
button:hover {
color: #111;
background: #00FF00;
}
hr {
color: #CCC;
-webkit-box-shadow: 1px 1px 2px #000;
-moz-box-shadow: 1px 1px 2px #000;
box-shadow: 1px 1px 2px #000;
}
table {
width: 300px;
border: 1px solid #ccc;
border-collapse: collapse;
margin: 20px 0;
}
caption {
font-weight: bold;
color: #0bbc4e;
margin-bottom: 10px;
}
table th, td {
border: 1px solid #ccc;
height: 35px;
text-align: center;
}
table th {
background-color: lightblue;
}
</style>
<body>
<div>
<p>登录后，抢购今日特价商品</p>
<form action = "#">
<input type = "email" name = "email" placeholder = "请输入邮箱" class = "input-group"><br>
<input type = "password" name = "password" placeholder = "请输入密码" class = "input-group"><br>
<span>会员级别:</span>
<label><input type = "radio" name = "vip" value = "0">普通会员</label>
<label><input type = "radio" name = "vip" value = "1" checked>VIP会员</label> <br>
<button>登录</button>
</form>
<hr>
<table>
<caption>今日特价商品</caption>
<thead>
<tr>
<th>序号</th>
<th>名称</th>
<th>库存</th>
<th>单价</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>牛奶</td>
<td>666</td>
<td>2</td>
</tr>
<tr>
<td>2</td>
<td>瓜子</td>
<td>555</td>
<td>12</td>
</tr>
<tr>
<td>3</td>
<td>鸡翅</td>
<td>100</td>
<td>28</td>
</tr>
<tr>
<td>4</td>
<td>牛排</td>
<td>100</td>
<td>18.8</td>
</tr>
<tr>
<td>5</td>
<td>西芹</td>
<td>100</td>
<td>2.5</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
批改老师：韦小宝批改时间：2019-01-22 09:23:14
老师总结：写的很不错 很规范 学习前段就是要照这样进行下去 课后还要记得多练习哦
