一、文本标签：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--标题标签：h1-h6
网页的内容涉及到标题的时候使用
-->
<h1>我是标题1</h1>
<h2>我是标题2</h2>
<h3>我是标题3</h3>
<h4>我是标题4</h4>
<h5>我是标题5</h5>
<h6>我是标题6</h6>
<!--2.段落标签：p
-->
<p>
我二房东方式父类说的按时 。<br/>
为佛教了是赋按时发的啦纪委好就就 *
万佛<strong>如果感到快乐</strong>我佛我发发生欧文 哦<b>地方地方</b>啊发安抚怕啥发
</p>
<!--水平线：hr
单标签
-->
<hr />
<!--列表标签：ul,ol.dl
ul:无序列表
ol：有序列表
dl：自定义列表
-->
<ul>
<li>语文</li>
<li>数学</li>
<li>英语</li>
</ul>
<ol>
<li>北京</li>
<li>成都</li>
<li>大连</li>
</ol>
<dl>
<dt>A</dt>
<dd>and</dd>
<dd>are</dd>
<dt>B</dt>
<dd>big</dd>
<dd>bug</dd>
</dl>
</body>
</html>
二、图片和超链接：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--1.图片标签：img标签
单标签
src属性：图片地址（可以是本地图片地址，也可以是远程服务器上的图片地址
-->
<img alt="加载失败！" title="baby" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1537175341880&di=92cbb1cf5a04be0e11a57ddbe06b47a3&imgtype=0&src=http%3A%2F%2Fimg3.duitang.com%2Fuploads%2Fitem%2F201502%2F12%2F20150212190903_VRXwA.jpeg" />
<!--2.超链接标签：a标签
想要点击跳转的地方都可以使用超链接语法
（1）href属性：跳转目标对应的地址
a.其他的网页地址
b.写本地的一个html路径 ------ 跳转
c.空 ------- 刷新当前网页
d.选择器 ----- 让网页跳转到指定的位置
（2）target属性：设置跳转方式
_self（默认值）：在当前页面中刷新出新的内容
_blank：创建一个新的页面，在新的页面中刷新出href指定的内容
-->
<a target="_blank" href="http://www.baidu.com">百度一下</a>
<a href="01-文本标签.html">文本标签</a>
<a href="">刷新</a>
</body>
</html>
三、表格标签：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表格标签</title>
</head>
<body>
<!--表格标签：table标签、tr标签、td标签、th标签
table标签：表格整体（一个table标签代表一个表格
tr标签：行（一个tr标签代表表格中的一行）
td标签：一个单元格（一个td代表一个单元格）
th标签：表头
2.属性
a.border属性：设置表格的边框的宽度（只能作为table属性）
b.bordercolor属性：设置边框的颜色(只能作用于table)
c.background:设置背景图片
d.bgcolor:
e.cellspacing
f.cellpadding
g.width
-->
<table border="1" bordercolor="red" bgcolor="blue" cellspacing="0">
<!--<tr><th>Header</th></tr>-->
<!--第一行-->
<tr>
<td>姓名</td>
<td>成绩</td>
<td>是否留级</td>
</tr>
<!--第二行-->
<tr>
<td>张三</td>
<td>90</td>
<td>否</td>
</tr>
<!--第三行-->
<tr>
<td>李四</td>
<td>80</td>
<td>否</td>
</tr>
</table>
<table border="1" cellspacing="" cellpadding="">
<tr><th>学生信息表</th></tr>
<tr height="80">
<td width="120">姓名</td>
<td width="250">毕业院校</td>
</tr>
<tr height="100">
<td></td>
<td></td>
</tr>
<tr height="100">
<td></td>
<td></td>
</tr>
<tr height="100">
<td></td>
<td></td>
<td></td>
</tr>
<tr height="100">
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
四、不合格表格：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
colspan:列合并
rowspan:行合并
-->
<table bgcolor="black" cellspacing="1" width="600" height="500">
<tr bgcolor="white">
<td></td>
<td></td>
<td colspan="2"></td>
<td></td>
</tr>
<tr bgcolor="white">
<td></td>
<td></td>
<td rowspan="2"></td>
<td rowspan="2"></td>
<td rowspan="2"></td>
</tr>
<tr bgcolor="white">
<td></td>
<td></td>
</tr>
<tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
<table bgcolor="black" cellspacing="1" width="500" height="500">
<tr bgcolor="white" >
<td></td>
<td colspan="3"></td>
</tr>
<tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr bgcolor="white">
<td rowspan="3"></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr bgcolor="white">
<td rowspan="2"></td>
<td rowspan="2"></td>
<td></td>
</tr>
<tr bgcolor="white">
<td></td>
</tr>
</table>
</body>
</html>
网友评论