Collection
Collection
一，完成一个跨行合并的表格：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表格</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="5" width="550" align="left">
<caption>购物车</caption>
<thead>
<tr bgcolor="lightblue">
<th>编号</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>金额</th>
<th>分类</th>
</tr>
</thead>
<tbody>
<tr>
<td width="50">1</td>
<td width="200">有备无患的奔驰专用机油</td>
<td width="70">800</td>
<td width="50">1</td>
<td width="80">800</td>
<td width="50">汽车</td>
</tr>
<tr>
<td>2</td>
<td>能看清鞋子的京东摄像头</td>
<td>150</td>
<td>2</td>
<td>300</td>
<td rowspan="2">电子</td>
</tr>
<tr>
<td>3</td>
<td>带暖手宝功能的笔记本电脑</td>
<td>4500</td>
<td>2</td>
<td>9000</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3" align="center">总计</td>
<!-- <td></td>-->
<!-- <td></td>-->
<td>5</td>
<td>10100</td>
<td> </td>
</tr>
</tfoot>
</table>
</body>
</html>
二，完成一个注册表单：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>用户注册</title>
</head>
<body>
<h3>用户注册</h3>
<form action="" method="get">
<p><lable for=""username">用户名：</lable>
<input type="text" id=username name=username placeholder=不超过8个字符 autofocus></p>
<p>
<label for="password">密码：</label><input type="password" name="password" id="password" placeholder="12的字母和数字组成" autofocus>
</p>
<p><label for="email">邮箱</label><input type="email" name="email" id="email" placeholder="example@mail.com" required></p>
<button type="submit">提交</button>
</form>
</body>
</html>
三、完成一个简易后台首页：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>后台管理</title>
</head>
<body>
<h2>后台管理</h2>
<ul style="float: left;">
<li><a href="demo3.html" target="main">用户管理</a></li>
<li><a href="demo4.html" target="main">分类管理</a></li>
<li><a href="demo5.html" target="main">商品管理</a></li>
<li><a href="demo6.html" target="main">系统设置</a></li>
</ul>
<iframe srcdoc="<h3>网站管理后台</h3>" frameborder="" width="600" height="500" style="float:left" name="main"></iframe>
</body>
</html>
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
