HTML中的常用标签及属性(表格)

原创 2019-01-18 17:17:16 359
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="ie=edg
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>HTML中的常用标签及属性(表格)</title>
<style rel="stylesheet" type="text/css">
body,table{padding:0px;margin:0px;}
table{border-collapse: collapse; width:700px;margin: 10px auto;}
th{background-color: lightslategray;color:white;font-size: 1.2em;}
th,td{border:1px lightgray solid;padding:3px 6px;line-height:22px;}
table,td{font-size:0.75rem;}
caption{font-size: 2em;font-weight: bold;line-height: 40px;}
button{background-color:lightcoral;border:none;width:88px;height:26px;line-height: 26px;
box-shadow:2px 1px -1px tomato;}
</style>
</head>
<body>
<table>
    <caption>HTML中的常用标签及属性(表格)</caption>
<thead>
<tr>
<th>作业名称</th>
<th width="15%">所属课程</th>
<th width="17%">提交时间</th>
<th width="13%">批阅状态</th>
<th width="13%"></th>
</tr>
</thead>
<tbody>
<tr>
<td>完成常用导航布局案例并附上自己的总结和理解完成作业!!</td>
<td>常用导航布局案例</td>
<td>2019-01-13 20:48:57</td>
<td>未完成</td>
<td><button>查看作业</button></td>
</tr>
<tr>
<td>结合本章课学习的内容做个小总结!并利用所学的知识完成自己的小案例!案例不限!!</td>
<td>CSS中的浮动</td>
<td>2019-01-13 22:14:05</td>
<td>已完成</td>
<td><button>查看作业</button></td>
</tr>
<tr>
<td>结合本章课学习的内容做个小总结!并利用所学的知识完成自己的小案例!案例不限!!</td>
<td>HTML中的常用标签及属性(表格)</td>
<td>2019-01-11 23:20:34</td>
<td>未完成</td>
<td><button>查看作业</button></td>
</tr>
<tr>
<td>利用这两节课所学的知识来实现一个HTML页面!页面内容不限!</td>
<td>html基础</td>
<td>2019-01-09 14:28:55</td>
<td>已完成</td>
<td><button>查看作业</button></td>
</tr>
</tbody>
</table>
</body>
</html>


批改老师:灭绝师太批改时间:2019-01-18 17:22:41
老师总结:总的完成的不错!表格中还有合并列合并行,也可以测试一下

发布手记

热门词条