HTML5结构体和标签大全
2017-10-13 本文已影响293人
MaShuai丨
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
</html>
-
<!DOCTYPE>: 定义文档类型.
-
html
- 告诉浏览器，这是一个网页。所有的标签，都必须写到html里面。
-
head
- 指定网站的标题/指定网站的小图片
- 添加网站的SEO信息（指定网站的关键字/指定网站的描述信息）
- 外挂一些外部的css/js文件。
- 添加一些浏览器适配相关的内容。
-
head标签的注意点
- 一般情况相爱，写在head标签内部的内容，都不会给用户查看。
-
title
- 专门用于指定网站的标题，并且这个指定的标题将来还会作为用户保存网站的默认标题。
-
title标签的注意点
- title必须写在head的里面
-
body
- 网页的内容必须写在body里面。
其他常用的标签
-
1.块级元素
- 标题<h></h>
- 有序列表<ol><li></li></ol>
- 无序列表<ul><li></li></ul>
- 定义列表<dl></dl>
- 段落标签<p></p>
- 预格式文本<pre></pre>
- 大段引用<blockquote></blockquote>
- 小段引用<q></q>
- 划分区块<div></div>
- 定义<figure></figure>
- 音频<audio></audio>
- 视频<video></video>
- 表格<table></table>
- 表单<form></form>
- 装载独立文章<article>
- 定义文档章节<section>
- 定义非正文内容<aside>
- 页眉<header>
- 页脚<footer>
- 导航链接部分<nav>
- 为文档或 section 定义联系信息<address>
- 制作更小字号的文本<small>
-
2.内联元素
- <div>:定义块级元素.
- <span>:定义行业元素.
- <header>51:定义区段或页面的页眉.(头部)
- <footer>5:定义区段或页面的页脚.(足部)
- <section>5:定义文档中的区段.
- <article>5:定义文章.
- <aside>5:定义页面内容之外的内容.
- <details>5:定义元素的细节.
- <summary>5:定义 <details> 元素可见的标题.10. <dialog>5:定义对话框或窗口.
- <nav>:定义导航.
- <hgroup>5:定义标题组
- <table>:定义表格.
- <thead>:定义页眉.
- <tbody>:定义主体.
- <tfoot>:定义页脚.
- <caption>:定义标题.
- <th>:定义表头.
- <tr>:定义一行.
- <td>:定义单元格.
-
3.内联块元素
- 图片<img />
- 内联框架<iframe></iframe>
- <img>:定义图像.注意加上alt属性
- <a>:定义超链接.
- <map>:定义图像映射。
- <area>:定义图像地图内部的区域.
- <figure>5:定义媒介内容的分组.
- <figcaption>5:定义 <figure> 元素的标题.
-
4.表单标签
- <form>:定义表单.(表单包含在form标签中)
- <input>:定义输入域.
- <textarea>:定义文本域.(多行)
- <label>:定义一个控制的标签.(input 元素的标注)
- <fieldset>:定义域.
- <legend>:定义域的标题.
- <select>:定义一个选择列表.
- <optgroup>:定义选择组.
- <option>:定义下拉 列表的选项.
- <button>:定义按钮.(定义围绕表单中元素的边框.)
- <fieldset>:定义围绕表单中元素的边框.
- <legend>:定义 fieldset 元素的标题.
- <fieldset>5:定义选项列表.与input 元素配合使用该元素，来定义 input 可能的值.
- <keygen>5:定义表单的密钥对生成器字段.
- <output>5:定义不同类型的输出，比如脚本的输出
-
5.表格标签
- <table>:定义表格.
- <thead>:定义页眉.
- <tbody>:定义主体.
- <tfoot>:定义页脚.
- <caption>:定义标题.
- <th>:定义表头.
- <tr>:定义一行.
- <td>:定义单元格.
-
6.列表标签
- <ul>:定义无序列表.
- <ol>:定义有序列表.
- <li>:定义列表项.
- <dl>:定义自定义列表.
- <dt>:定义自定义列表项.
- <dd>:定义自定义的描述.
-
7.音频/视频
- <audio>5:定义声音内容.
- <source>5:定义媒介源.
- <track>5:定义用在媒体播放器中的文本轨道.
- <video>5:定义视频.
-
8.格式标签
-
文章标签
- 1.<h1>-<h6>:定义 HTML 标题.
- 2.<p>:定义段落.
- 3.< br>:定义换行.
- < hr>:定义水平线.
- <bdo>:定义文字方向.
- <pre>:定义预格式文本.
- <abbr>:定义缩写.
- <address>:定义文档作者或拥有者的联系信息.
- <ins>:定义被插入文本.
- <del>:定义被删除文本.
- <time>:定义日期/时间.
-
短语元素标签
- <em>:定义强调文本.
- <strong>:定义语气更为强烈的强调文本.
- <dfn>:定义定义项目.
- <code>:定义计算机代码文本.
- <samp>:定义计算机代码样本.
- <kbd>:定义键盘文本.
- <var>:定义文本的变量部分.
- < sup>:定义上标文本.
- < sub>:定义下标文本.
- <cite>:定义引用.
- <blockguote>:定义长的引用.
- <q>:定义短的引用.
-
字体样式标签
- <i>:显示斜体文本效果.
- <b>:呈现粗体文本效果.
- <big>:呈现大号字体效果.
- <small>:呈现小号字体效果.
- <mark>5:定义有记号的文本.
-
