<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keyword" content="鲜花，玫瑰花，...">
<meta name="description" content="卖各种鲜花...">
<mate http-equiv="X-UA-Compatible" content="ie=edge">
<title>HTML常用标签</title>
</head>
<body>
<!-- 标题 heading -->
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
<!-- 段落 paragraph -->
<p>这是一个段落</p>
<!-- 无序列表 ul(unorder list) -->
<ul>
<li>这是li</li>
<li>这是li</li>
<li>这是li</li>
</ul>
<!-- ol>li*3 (快捷键)再按回车(或者Tab健)可以直接生成 -->
<ol>
<li></li>
<li></li>
<li></li>
</ol>
<!-- ol>li{item $}*3 (快捷键)再按回车(或者Tab健)可以直接生成 -->
<!-- 有序列表 ol(order list) -->
<ol>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ol>
<!-- anchor 链接 当前路径跳转 -->
<a href="http://www.qq.com">这是链接</a>
<!-- anchor 链接 新建页面跳转 -->
<a href="http://www.qq.com" target="_blank">这是一个链接</a>
<!-- anchor 链接 当前自己路径跳转 -->
<a href="http://www.qq.com" target="_self">这是一个链接。</a>
<!-- src为加载路径 可以显示图片 -->
<img src="base-red.png" alt="">
<!-- 若图片未正常加载，显示alt内容 -->
<img src="base-red111.png" alt="这是一个图标">
<!-- title可以让鼠标停留图片的时候，有文字提示 -->
<img src="base-red.png" alt="这是一个图标" title="这是一个图标">
<!-- alt 和 title 是对图片的一个介绍 -->
<!-- 字体加黑 -->
<strong>这是一个strong</strong>
<!-- em 和 strong 都是对文字做强调 strong 更强，em 虽然斜，但不是真正的斜体-->
<em>这是em</em>
<!-- 字体为斜体 -->
<i>这是斜体</i>
<!-- table 表格 tr 行 td 为一个单元格 -->
<table border="1">
<tr>
<td>11</td>
<td>12</td>
<td>13</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
<td>23</td>
</tr>
</table>
<!-- 表单 输入框 可以输入内容 -->
<input type="text">
<!-- 表单 按钮 -->
<button>这是一个按钮</button>
HTML标签语义化
<!-- 以上为HTML标签语义化 -->
<!-- divide 区块 ，没有HTML标签语义化 -->
<div>这是一个div</div>
<!-- 当你想个网页中一小段文字加一些样式用span，并不是强调 ，没有HTML标签语义化-->
<span>这是一个span</span>
<span>这是一个span2</span>
</body>
</html>
