效果图:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QQ注册</title>
<style>
#zhuce td{
height: 50px;
}
#username,#password{
height: 40px;
width: 100%;
}
#area{
width: 30%;
height: 40px;
}
#tel{
width: 66%;
height: 35px;
}
</style>
</head>
<body>
<form action="#" method="get">
<table >
<tr>
<td rowspan="3"><img src="./img/QQ注册.png" alt="QQ注册"></td>
<td></td>
<td>
<table>
<tr>
<td><img src="./img/QQ靓号.png" alt="QQ靓号" height="32px"></td>
<td>
<select name="language" id="language">
<option value="简体中文" selected>简体中文</option>
<option value="English">English</option>
</select>
</td>
<td>意见反馈</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table id="zhuce">
<th style="display: table-header-group;">欢迎注册QQ</th>
<tr>
<td>每一天,乐在沟通。</td>
<td><a href="#">免费靓号</a></td>
</tr>
<tr>
<td colspan="2">
<input type="text" name="username" id="username" placeholder="昵称" required>
</td>
</tr>
<tr>
<td colspan="2">
<input type="password" name="password" id="password" placeholder="密码">
</td>
</tr>
<tr>
<td colspan="2">
<select name="area" id="area">
<option value="+86">+86</option>
<option value="+98">+98</option>
</select>
<input type="tel" name="tel" id="tel" placeholder="手机号码">
<br>
可通过改手机号找回密码
</td>
</tr>
<tr>
<td colspan="2">
<input type="image" src="./img/立即注册.png" alt="立即注册">
</td>
</tr>
<tr>
<td colspan="2">
<input type="checkbox" name="checkbox" id="checkbox" checked>
<label for="checkbox">我已阅读并同意相关服务条款和隐私政策</label>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>Copyright@ 1998-2020Tencent All Rights Reserved</td>
</tr>
</table>
</form>
</body>
</html>