头部元素 head

title

定义了浏览器工具栏的标题
当网页添加到收藏夹时，显示在收藏夹中的标题
显示在搜索引擎结果页面的标题

<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>
<hr> // 水平线

base

<base>标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接

<base href="http://www.runoob.com/images/" target="_blank">

link

标签定义了文档与外部资源之间的关系，通常用于链接到样式表

<link rel="stylesheet" type="text/css" href="mystyle.css">

style

<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>

段落

<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p>这个<br>段落<br>演示了分行的效果</p> // <br/> 插入单个折行（换行）

文本格式化

标签	描述
<b>	定义粗体文本
<em>	定义着重文字
<i>	定义斜体字
<small>	定义小号字
<strong>	定义加重语气
<sub>	定义下标字
<sup>	定义上标字
<ins>	定义插入字
<del>	定义删除字

链接

<a href="http://www.runoob.com">这是一个链接</a>
// 使用 target 属性，你可以定义被链接的文档在何处显示。下面的这行会在新窗口打开文档：
<a href="http://www.runoob.com/" target="_blank">访问菜鸟教程!</a>

图像

img

<img src="/images/logo.png" width="258" height="39"  alt="Big Boat"/>

map / area

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>

表格

表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

表格的表头使用 <th> 标签进行定义。大多数浏览器会把表头显示为粗体居中的文本。

<table border="1">
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
    </tr>
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

标签	描述
<table>	定义表格
<th>	定义表格的表头
<tr>	定义表格的行
<td>	定义表格单元
<caption>	定义表格标题
<colgroup>	定义表格列的组
<col>	定义用于表格列的属性
<thead>	定义表格的页眉
<tbody>	定义表格的主体
<tfoot>	定义表格的页脚

列表

有序列表

有序列表是一列项目，列表项目使用数字进行标记。有序列表始于

标签。
列表项使用数字来标记。

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

<ol start="50">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

无序列表

无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。
无序列表使用

标签

<h4>无序列表:</h4>
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

自定义列表

自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以

标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

<dl>
    <dt>Coffee</dt>
    <dd>- black hot drink</dd>
    <dt>Milk</dt>
    <dd>- white cold drink</dd>
</dl>

区块元素

div

HTML <div> 元素是块级元素，它可用于组合其他 HTML 元素的容器。

<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。

如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。

<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。

span

HTML <span> 元素是内联元素，可用作文本的容器

<span> 元素也没有特定的含义。

当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。

表单form

<form>
.
input 元素
.
</form>

input

type:

text
password
radio
checkbox
submit
button

其他

textarea
label
fieldset
legend
select
optgroup
option
button
datalist
keygen
output

框架

<iframe src="demo_iframe.htm" width="200" height="200" frameborder="0"></iframe>

注释

<!-- --> // html注释

HTML基本元素

目录