<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>my first html</title>
<link rel="icon"type="image/ico" href="img/aaa.ico"/>
</head>
<body>
<a>就这个feel,倍儿爽</a>
<h1>就这个feel,倍儿爽1</h1>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>1</h1>
<h2>2</h2>
<h3>3</h3>
<h4>4</h4>
<h5>5</h5>
<h6>6</h6>
<!--2.段落标签(p标签)
双标签,保证一个段落对应一个p标签
一个标签占一行
-->
<p>
111111111111111
</p>
<p>
222222222222222
</p>
<p>111111111111111
222222222222222</p>
<!--3.font标签
双标签
一行可以有多个
-->
<font>性别</font>
<font>男</font>
<font>女</font>
<!--4.文字效果相关的标签
在HTML中直接敲回车或者空格、缩进是无效的。
<br/> - 单标签,让网页中的内容强制换行
- 一个" "代表一个像素
  - 一个空格
<b></b> - 加粗
<strong></strong> - 加粗(有强调的意义)
<i></i> - 倾斜
<em></em> - 倾斜(有强调的意义)
-->
<p>
1<br/>
2<strong><b><i>3</i></b>4</strong>
 3<i>3</i>
</p>
<font>性别</font></br>
<font>男</font>
<font>女</font>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>列表</title>
</head>
<body>
<ul>
<li>成都</li>
<li>北京</li>
<li>上海</li>
<li>河南</li>
<li>河北</li>
<li>重庆</li>
</ul>
<!--2.有序列表(ol)
ol标签 - 代表列表容器，是一个整体
li标签 - 代表列表中的元素
-->
<ol>
<li>买小龙虾</li>
<li>清理小龙虾</li>
<li>煮小龙虾</li>
</ol>
<!--3.自定义列表(dl)
dl标签 - 代表列表容器,是一个整体
dt标签 - 小分类标签(名词)
dd标签 - 小分类小面的元素(解释)
-->
<dl>
<dt>四川</dt>
<dd>成都</dd>
<dd>绵阳</dd>
<dd>眉山</dd>
<dt>辽宁</dt>
<dd>大连</dd>
<dd>沈阳</dd>
<dd>盘锦</dd>
</dl>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图片和超链接</title>
</head>
<body>
a.src属性:设置图片地址/路径;可以是本地路径、网络地址
b.title属性:设置图片标题(当鼠标停留在图片上才会显示出来)
c.alt属性: 图片加载失败的时候的提示信息
-->
<img src="img/luffy.jpg" alt="图片不存在!"/>
<img title="百度"src="https://www.baidu.com/img/bd_logo1.png?where=super" />
<br/>
<!--超链接(a)
1)href属性:跳转的目的地
a.网址 - 点击超链接直接加载网址对应的网页
b.本地HTML文件地址 - 点击超链接直接加载本地HTML文件对应的网页
c.# - 刷新
d.选择器 - 让当前页面滚动到指定位置
2)target属性:跳转方式
_self - 在当前页面中加载新的网页
_blank - 在新的页面中加载新的网页
-->
<!--加载网页-->
<a id="#top"></a>
<a href="https://www.baidu.com" target="_self">百度</a>
<a href="https://www.baidu.com" target="_blank">百度(新)</a>
<p id="p1">第一组</p>
<a href="img/luffy.jpg">路飞</a>
<a href="https://www.baidu.com">百度一下</a>
<a href="https://www.baidu.com"><img src="https://www.baidu.com/img/bd_logo1.png?where=super"></a>
<br/>
<a href="img/luffy.jpg">路飞</a>
<a href="https://www.baidu.com">百度一下</a>
<a href="https://www.baidu.com"><img src="https://www.baidu.com/img/bd_logo1.png?where=super"></a>
<br/>
<a href="img/luffy.jpg">路飞</a>
<a href="https://www.baidu.com">百度一下</a>
<a href="https://www.baidu.com"><img src="https://www.baidu.com/img/bd_logo1.png?where=super"></a>
<br/>
<!--加载本地HTML文件 -->
<a href="03-列表标签.html">列表</a>
<!--刷新当前网页 -->
<a href="#">刷新</a>
<!--页面内的跳转-->
<a href="#p1">第一组</a>
<a href="#top">回到顶部</a>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>标签</title>
</head>
<body>
border属性:设置单元格边框的宽度
bordercolor属性:单元格边框的颜色
2.tr - 代表表格中的一行
bgcolor属性:设置一行中所有单元格的背景颜色
height属性:设置一行的高度
align属性:让一行中所有单元格的内容在单元格中居中、居左或者居右
3.td - 代表表格中的一个单元格
bgcolor属性:设置一个单元格的背景颜色
width属性: 设置td所在的列的宽度
align属性: 让当前单元格中的内容弄在单元格中居中、居左或者居右
补充:细线表格
1)设置整个的table的背景颜色是边框线的颜色
2)设置每个单元格颜色和边框线颜色不一样
3)设置单元格和单元格的间距(cellspacing)为1
-->
<table cellpadding="20" cellspacing="0" bordercolor="red" border="1" align="center" width="50" height="50">
<!--第一行-->
<tr bgcolor="blue" align="right">
<!--第一行第一列-->
<td bgcolor="pink">姓名</td>
<!--第一行第二列-->
<td>成绩</td>
<!--第一行第三列-->
<td>学员评价</td>
</tr>
<!--第二行-->
<tr bgcolor="skyblue">
<td>第二行第一列</td>
<td>第二行第二列</td>
<td>第二行第三列</td>
</tr>
<!--第三行-->
<tr bgcolor="cadetblue">
<td>第三行第一列</td>
<td>第三行第二列</td>
<td>第三行第三列</td>
</tr>
<!--第四行-->
<tr bgcolor="chartreuse">
<td>第四行第一列</td>
<td>第四行第二列</td>
<td>第四行第三列</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table cellspacing="0" border="1" bgcolor="blue" width="1000" height="500">
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan="2"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan="2"></td>
</tr>
<tr>
<td></td>
<td colspan="2"></td>
<td rowspan="3"></td>
<td rowspan="3" rowspan="3"></td>
</tr>
<tr>
<td></td>
<td colspan="2"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td rowspan="2"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
