按照这个样式进行页面设计
代码实现：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>testo1</title>
</head>
<body>
<p style="text-align: center;"> 班级座位表</p>
<table border="1px" cellspacing="0" class="lone">
<tr>
<td></td>
<td></td>
<td></td>
<td rowspan="6"></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td style="color: red;text-align: center; ">我在这</td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr >
<td colspan="8">讲台</td>
</tr>
</table>
</body>
<style type="text/css">
.lone{
width: 1000px;
height:500px;
margin: auto;
font-size: 13px;
}
tr {
width: 500px;
height: 50px;
}
td {
width: 50px;
text-align: center;
font-size: 15px;
}
</style>
</html>
代码实习：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>testo1</title>
</head>
<body>
<p style="text-align: center;"> 我的简历</p>
<table border="1px" cellspacing="0" class="lone">
<tr>
<td>姓名</td>
<td></td>
<td>性别</td>
<td></td>
<td>出生年月</td>
<td></td>
<td rowspan="4"></td>
</tr>
<tr>
<td>民族</td>
<td></td>
<td>政治面貌</td>
<td></td>
<td>身高</td>
<td></td>
</tr>
<tr>
<td>学制</td>
<td></td>
<td>学历</td>
<td></td>
<td>户籍</td>
<td></td>
</tr>
<tr>
<td>专业</td>
<td></td>
<td colspan="2">毕业院校</td>
<td></td>
<td></td>
</tr>
<tr>
<td colspan="7">技能、特长、爱好</td>
</tr>
<tr>
<td>外语等级</td>
<td colspan="2"></td>
<td>计算机等级</td>
<td colspan="3"></td>
</tr>
<tr>
<td colspan="7">联系方式</td>
</tr>
<tr >
<td>通讯地址</td>
<td colspan="2"></td>
<td>联系电话</td>
<td colspan="3"></td>
</tr>
<tr >
<td>E-mail</td>
<td colspan="2"></td>
<td>邮编</td>
<td colspan="3"></td>
</tr>
<tr >
<td></td>
<td colspan="2"></td>
<td></td>
<td colspan="3"></td>
</tr>
<tr >
<td colspan="7">自我评价</td>
</tr>
<tr >
<td colspan="7"></td>
</tr>
</table>
</body>
<style type="text/css">
.lone{
width: 1000px;
height:500px;
margin: auto;
font-size: 20px;
}
tr {
width: 200px;
height: 20px;
}
td {
width: 20px;
text-align: center;
font-size: 10px;
}
</style>
</html>
代码实习：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>test03</title>
</head>
<body>
<div class="main">
<h1 style="color: blue; text-align: center;" >90后大学生恋爱观调查问卷</h1>
亲爱的文理学院同学:</br>
你好，爱情是人与人之间的强烈的依恋、亲近、向往，以及无私专一并且无所不尽其心的情感。</br>
古诗云，“窈窕淑女，君子好逑”，又有“所谓伊人，在水一方”还有“得成比目何辞死，愿作</br>
鸳鸯不羡仙”。大学生正值青春年华，对美好的爱情总是充满了憧憬。为此，我们特地做一份关</br>
于大学生恋爱观的调查问卷。请你仔细阅读题目及答案，根据自己对题目的理解，逐题填写。本</br>
问卷的答案无所谓好坏对错，且问卷答案只做团体性分析，不做任何个别呈现。对外绝对保密，</br>
所以请你据实放心填写。感谢你的合作。
<hr style="border:1px dashed #000; height:1px">
1.你的性别*</br>
<input id="man" type="radio" name="1"> A男
<input id="man" type="radio" name="1"> B女
<hr style="border:1px dashed #000; height:1px">
2.你所在的年纪是*</br>
<input id="man" type="radio" name="1"> A大一
<input id="man" type="radio" name="1"> B大二
<input id="man" type="radio" name="1"> C大三
<input id="man" type="radio" name="1"> D大四
<hr style="border:1px dashed #000; height:1px">
3.你的家庭结构是*</br>
<input id="man" type="radio" name="1"> A健全家庭
<input id="man" type="radio" name="1"> B单亲家庭
<input id="man" type="radio" name="1"> C重组家庭
<input id="man" type="radio" name="1"> D其他
<input style="outline: none;"></br>
4.愿得一人心，白头不分离，你能接受一下哪些恋情*
<p style="color: blue;">【多选题】</p>
<input type="checkbox" value="sleep" name="hobby"/>异地恋
<input type="checkbox" value="code" name="hobby"/>师生恋
<input type="checkbox" value="chat" name="hobby"/>姐弟恋
<input type="checkbox" value="game" name="hobby" />网恋
<input type="checkbox" value="game" name="hobby" />同性恋
<input type="checkbox" value="game" name="hobby" />忘年恋</br>
5.关于恋爱,你有哪些看法?或者你存在什么困惑?</br>
<input type="text" placeholder="有什么困惑或看法" style="width: auto;"></br>
<hr style="border:1px dashed #000; height:1px">
<button type="button" c style="background-color: blue;color: aliceblue;" >提交</button>
</div>
</body>
<style type="text/css">
tr {
width: 200px;
height: 20px;
}
td {
width: 20px;
text-align: center;
font-size: 10px;
}
.main{
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
margin:auto;
text-align: center;
}
</style>
</html>
互相点个赞呗！