说道HTML，首先不得不介绍一下两个东西W3C 与 MDN

W3C全称万维网联盟（World Wide Web Consortium），该组织制定了包括XML和CSS等的众多影响深远的标准规范，当然，该标准并非强制标准，而只是推荐标准。不过既然是入门，最后当然是按照推荐标准来学习。

w3.org/TR/html5/

里面有HTML5各种详细介绍，包括每个标签的使用，是初学者自学的好地方，前提你要懂英文。

至于不懂英文也不用怕，下面我就介绍一下MDN

MDN(MDN Web Docs)是一个汇集众多Mozilla基金会产品和网路技术开发文档的免费网站。什么标签不会用，在谷歌搜索一下就有详细介绍。

下面以<span>标签为例

接下来我就介绍一下HTML5的几个常用标签

HTML5格式

<!DOCTYPE html>
<html>
<head>开头</hear>
<body>正文</body>
</html>

快捷键!+ tab

特殊标签

<div>块元素容器，无默认样式
<span>行内元素容器，无默认样式

文本样式

<b>加粗 <s>删除线
<i>倾斜 <sub>上标
<u>下划线 <sup>下标
<small>弱化标记 <strong>强调标记
<kbd>键盘键位标记

文本格式

<p>段落 <br>换行（空元素）
<hr>分割线（空元素）

标题

<h1>到<h6>，<h1>最大，<h6>最小。

结构标记

<header>页头
<nav>导航条
<section>文档
<article>除文档外的内容
<footer>页脚
<aside>侧边栏，广告栏，引用信息

链接

<a href="#" target="#"> <img src="#" alt="#" >
href写网址，跳转网页，href写id，定位改id锚点 src写图片的路径
target="_blank",在新的标签打开链接 alt，当你图片载入不到会显示该属性的文字
target=「_self」,在该标签打开链接

<video>插入视频
<audio>插入音频

列表

<ol><li>有序列表，两个标签要同时用
<ul><li>无序列表，也是要同时用

<dl>定义列表
<dt></dt>名词
<dd></dd>名词解释
</dl>

输入框

<input type="#"> 根据type不同创建的输入框功能也不同
type="text" 文本输入框 type="submit" 提交按钮
type="password" 密码框 type="reset" 重置按钮
type="radio" 单选框 type="button" 普通按钮
type="checkbox" 复选框 type="file" 文件选择框
type="hidden" 隐藏域

选项框

<select>选项框
<option></option>菜单里的选项
</select>

文本框

<textarea>

表格

<table>表格
<caption>##</caption>标题
<tr>表格行
<td>##</td>表格列
</tr>
</table>

输入表单

<form> 输入表单,必须含一个或者多个表单元素，如下：
<textarea></textrea>
<button></button>
<input>
</form>

介绍完常用标签，我顺便说说三个概念

1.元素

元素和标签是不相同的东西

以<div class="XXX">你好</div>为例，其中<div class="XXX">是开始标签，class="XXX"是属性，「你好」是值，</div>是一个结束标签，这整个就是元素

2.空元素

空元素，从MND概述中理解起来还是很抽象的，我也不在这里复制一遍水字数了，我就说说我的理解，一般没有值和结束标签的元素就是空元素。

我查了一下，HTML 中的空元素有这些：

<area> <base> <br> <col> <embed> <hr> <img> <input>
<keygen> <link> <meta> <param> <source> <track> <wbr>

3.替换元素

顾名思义，就是浏览器显示的不再是HTML的元素，而是被替换了，例如显示ico，图片，视频，表单等等。一部分可替换元素可以用CSS来控制显示出来的大小，但并不能控制这些元素本身（例如颜色，外观，渲染等等）。


推荐阅读：
相关文章