<!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>
<!--
段落标签
p标签 会自动换行
块级元素
-->
<p>这是一个段落1</p>
<p>这是一个段落2</p>
<!--
换行标签
br 单行标签
<br><br/>
-->
<!--
水平线标签
hr 单标签
常用属性
color 颜色
size 粗细
width 长度<百分比 或 像素值>
-->
<hr>
<hr color="aqua" size="3" width="50%" align="left">
<!--
列表
有序列表
<ol><li></li></ol>
无序列表
<ul><li></li><ul>
-->
<ul type="square">
<li>周杰伦</li>
<li>林俊杰</li>
</ul>
<ol type="1">
<li>周杰伦</li>
<li>林俊杰</li>
</ol>
<!--
div标签
块级元素
默认占全部的宽度 有多少内容高度占多少
可以设置div的宽 width 高 height
对齐方式---align---left---right--center
-->
<div style="width:100px;height: 100px;"align="center">这是一个div</div>
1111
<!--
span标签
行内元素(不会自动换行)
-->
<span>这是一个span</span>
<!--
格式化标签
color 字体颜色
size 字体尺寸
face 字体风格
pre
欲格式化标签 保留空格和换行
b 加粗
i 倾斜
u 下划线
del 中划线
sup 上标
sub 下标
-->
<font color="aqua"size="5"face="楷体">Hello World</font>
<pre>
Hello World
</pre>
<p><b>烦死</b><i>了一</i><u>天天</u>的</p>
H<sub>2</sub>O
<!--
a标签
超链接标签,由于链接到一个新的URL
常用属性:
href:需要跳转的地址(必须属性))
target:窗口打开的方式
_self:当前窗口(默认)
_blank:在空白窗口
作为锚点:
a标签的name属性
<a name="top"></a>
其他的id属性值
<div id="top"></div>
锚点的使用
<a href="#top"></a>
-->
<a href="http://www.baidu.com" target="_blank">百度</a>
<hr>
<h2 id="znjl">早年经历<br>
*****************
**************
***********</h2>
<a href="#">回到到顶部</a>
<a href="#znjl">早年经历</a>
<!--
img标签
向网页中嵌入一张图片
常用属性:
src:需要引入的图片的地址(必须属性)
alt:当图片破损或不存在时,显示的文本
title:当图片悬停在图片上时显示的文本
width:图片的宽度
height:图片的高度
border:图片的边框
-->
<img src="img/bd.png"width="500" height="500" border="2" title="点击了解更多">
<!--
表格标签:
table:表格
tr:行
td:标准单元格
th:表头(字体居中、加粗效果)
table的属性
width 表的宽度
border 边框
align 对齐方式
style="border-collapse:collapse;合并表格的边框
-->
<table width="400px" align="center"border="1"style="border-collapse:collapse;">
<tr>
<th>编号</th>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr align="center" bgcolor="aqua">
<th>1</th>
<th>张三</th>
<th>18</th>
</tr>
<tr>
<th>2</th>
<th>宣传</th>
<th>22</th>
</tr>
</table>
</body>
</html>