<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>0403作业</title>
</head>
<body>
<header>
<nav>
<!--链接元素-->
<!--a元素标签的target属性规定浏览器打开页面的方式-->
<a href="https://www.php.cn/" target="_blank">php中文网</a
><!--属性值：_blank ，新的窗口打开目标-->
<a href="http://404.cn/" target="_self">码农云</a>
<!--属性值：_self ,在该窗口打开页面，也是为a元素标签的默认属性-->
<a href="#table">表格元素</a>
<!--table锚点-->
<a href="#form">表单元素</a>
</nav>
</header>
<div class="container">
<aside>
<dl>
<dt>云服务器</dt>
<dd><a href="#table">价格表</a></dd>
<dt>会员中心</dt>
<dd><a href="#form">现在注册</a></dd>
</dl>
</aside>
<main>
<section style="padding-top: 1000px;">
<table
border="1"
width="700"
height="300"
cellpadding="5"
cellspacing="0"
>
<a name="table"></a>
<colgroup bgcolor="lightpink">
<col />
<col bgcolor="lightgreen" />
<col bgcolor="yellow" span="2" />
<col />
<col />
</colgroup>
<caption style="font-size: 24px; margin-bottom: 10px;">
云服务器价格表
</caption>
<thead bgcolor="lightblue">
<tr>
<th>地区</th>
<th>CPU</th>
<th>内存</th>
<th>硬盘</th>
<th>宽带</th>
<th>价格</th>
</tr>
</thead>
<tbody align="center">
<tr>
<td rowspan="3">杭州</td>
<td>1核</td>
<td>1G</td>
<td>50GB</td>
<td>1M</td>
<td>69</td>
</tr>
<tr>
<td>2核</td>
<td>2G</td>
<td>50GB</td>
<td>2M</td>
<td>169</td>
</tr>
<tr>
<td>4核</td>
<td>4G</td>
<td>50GB</td>
<td>5M</td>
<td>369</td>
</tr>
<tr>
<td rowspan="3">贵阳</td>
<td>1核</td>
<td>1G</td>
<td>50GB</td>
<td>1M</td>
<td>69</td>
</tr>
<tr>
<td>2核</td>
<td>2G</td>
<td>50GB</td>
<td>2M</td>
<td>169</td>
</tr>
<tr>
<td>4核</td>
<td>4G</td>
<td>50GB</td>
<td>5M</td>
<td>369</td>
</tr>
</tbody>
<tfoot align="center">
<tr>
<td colspan="6">联系客服开通</td>
</tr>
</tfoot>
</table>
</section>
<section style="margin-top: 1000px;">
<a name="form"></a>
<h3>用户注册</h3>
<!-- 单行文本输入框 -->
<section>
<label for="username">用户名:</label>
<input
type="text"
name="username"
id="username"
maxlength="20"
placeholder="不少于6位"
required
/>
</section>
<!-- 密码输入框 -->
<section>
<label for="password">密码:</label>
<input
type="password"
name="password"
id="password"
size="10"
placeholder="不少于8位"
required
/>
</section>
<!-- 单选框 -->
<section>
<label for="secret">性别:</label>
<div>
<input
type="radio"
name="gender"
id="male"
value="male"
/><label for="male">男</label>
<input
type="radio"
name="gender"
id="female"
value="female"
/><label for="male">女</label>
<input
type="radio"
name="gender"
id="secret"
value="female"
checked
/><label for="secret">保密</label>
</div>
</section>
<section>
<label for="programme">兴趣:</label>
<div>
<input type="checkbox" name="hobby[]" id="game" checked /><label
for="game"
>游戏</label
>
<input
type="checkbox"
name="hobby[]"
id="travel"
checked
/><label for="travel">旅游</label>
<input
type="checkbox"
name="hobby[]"
value="shoot"
id="shoot"
/><label for="shoot">摄影</label>
<input
type="checkbox"
name="hobby[]"
value="programme"
id="programme"
checked
/><label for="programme">编程</label>
</div>
</section>
<button>注册</button>
</form>
</section>
</main>
</div>
</body>
</html>