目录
整理仓促，文章中有任何问题，敬请提出，感谢支持，让我们共同进步吧！
前端的相关知识概述，从头学习前端“三剑客”（HTML5、Css、JavaScript），共分基础篇（HTML5）、进阶篇（Css）和高级篇（JavaScript）！
本篇为基础篇！
1、HTML概念
HTML是 HyperText Markup Language 的简称，中文名称： 超文本标记语言 ，它是一种用于创建网页的标准标记语言。 标记语言是由标签构成的语言，例如 html ， xml ；注意：标记语言不是编程语言。HTML 运行在浏览器上， 由浏览器来解析。
2、属性
1. 后缀名.html和 .htm 两种都可以，没有区别。授课中都是 .html后缀名，个人习惯不同而已。2. 标签的分类围堵标签：有开始标签和结束标签，例如 <html></html>自闭和标签：开始标签和结束标签都在一个标签中 <br/>3. 嵌套标签可以嵌套，但是嵌套的语法要正确4. 定义属性标签的内部是可以定义属性的，属性由键值对组成，值需要用双引号引起来，多个属性用空格隔开
3、基本结构
（1）结构
<!-- 声明当前文档是html5文档 -->
<!DOCTYPE html>
<!-- html,根元素 ，围堵标签-->
<html>
<!--head,头元素：
作用：
1、用于指定HTML文章中的一些元数据， 例如元数据 meta：定义页面的编码格式 title:定义页面的标题 2、引入外部的资源文件
-->
<head>
<title>这是我的第一个HTML页面</title>
</head>
<!--
body，主体：
浏览器显示的内容都将在这里编写
格式化代码的快捷键：ctrl+shift+f（英文状态下使用）
-->
<body>
hello html 这是我的第一个HTML页面
</body>
</html>（2）注释
语法：HTML 注释以 <!-- 开头 ，以 --> 结尾。注释的部分浏览器不解析，注释是为了给程序员看，更好的了解 html 代码
4、常用标签
（1）文本标签
标题标签
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
特点：字体逐渐缩小（2）换行标签
<br>（3）段落标签
<p></p>
（4）水平线标签
<hr>（5）范围标签
一般在大段内容中，为了突出部分内容的时候使用的标签；很少独立使用，一般嵌套在其他的标签中使 用。不是因为有了范围标签，局部内容的样式才有变化；是为了改变局部内容样子，我们才通过范围标签包裹，然后修改它的样式。
（6）图片标签
<img src="xx.jpg">（7）列表标签
一般用在导航
无序列表
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
有序列表
<ol>
<li></li>
<li></li>
<li></li>
<li></li>
</ol>（8）超链接
超链接标签一般有两个作用： 1 、用来实现页面间的跳转 2 、实现锚链接功能
<a href="www.baidu.com"></a>（9）表单
概念：用于采集用户输入的数据。用于和服务器进行交互。
表单项元素中的一些属性：
id: 元素的唯一表示，不重复name: 表单项元素的名称，很重要 -- 提交数据到服务器之后，服务器获取数据通过该名称value: 表单项元素的值，服务器获取数据通过 name 获取到的就是 valuetype: 表示表单项元素的呈现形式class: 表示样式名称readonly: 表示只读，用户只能看不能改disabled ：表示禁用，该元素不能改而且背景是灰色
（10）组合标签
div-ul-li/div-ol-li ：常用于导航布局div-dl-dt-dd: 常用于图文混编布局div-form: 常用于表单布局div-table: 常用于局部规则数据展示布局
（11）转义符号
转义为空格<转义为小于号 <&le ;转义为小于等于号 ≤>转义为大于号>≥转义为大于等于号≥©转义为版权符号 ©
5、标签分类（面试）
html标签可以分为块状元素和行级元素两类。块状元素：一般都是新起一行，可以容纳行内元素和其他块级元素；行级元素：一般都是语义级别的基本元素，一般只能容纳文本或者其他行内元素。PS:区分的简单方法：是否独占一行。块状元素和行内元素的区别：1、 块级元素会独占一行，其宽度自动填满其父元素宽度；行内元素会排列到同一行里，其宽度随元素的内容变化而变化。2、块级元素可以设置宽高；行内元素设置宽高无效。3、块级元素可以设置 margin ， padding 属性；行内元素的水平方向的 padding会有边距效果，但是竖直方向的padding没有效果。属于块状元素的：标题标签 h1-h6,段落标签 p ,水平线标签 hr,有序列表标签 ol--li，无序列表标签 ul--li，定义描述标签 dl-dt-dd，容器标签 div：属于行级元素的：范围标签：span图像标签：img
6、HTML4与HTML5的区别
HTML4 和 HTML5 分别是超文本标记语言的第四次和第五次修改，他们分别是 html 语言第 4 和第 5 版本HTML4 是为了适应 pc 时代产生的， HTML5 是为了适应移动互联网时代 , 为了在移动设备上支持多媒 体。 HTML5 是互联网的下一代标准，是构建以及呈现互联网内容的一种语言方式．被认为是互联网的核心技 术之一。HTML 产生于 1990 年， 1997 年 HTML4 成为互联网标准，并广泛应用于互联网应用的开发。HTML5 将 Web 带入一个成熟的应用平台，在这个平台上，视频、音频、图像、动画以及与设备的交互都进行了规范。HTML5 技术在未来主要发展的市场还是在移动端互联网领域，现阶段移动浏览器有应用体验不佳、网页标准不统一的劣势，这两个方面是移动端网页发展的障碍，而 HTML5 技术能够解决这两个问题，并且将 劣势转化为优势，整体推动整个移动端网页方面的发展。HTML4: 使用 meta 元素的形式指定文件中的字符编码 ( 通过 content 元素的属性来指定 )HTML5: 使用对元素直接追加 charset 属性的方式来指定字符编码。从 H5 开始，对于文件的字符编码推荐使用UTF-8 。
7、推荐两个编辑器
HBuilder下载地址: HBuilderX-高效极客技巧sublime text
8、推荐两个学习网站
菜鸟教程
w3school
网址：HTML5 简介
9、两点建议
（1）纸上得来终觉浅，绝知此事要躬行。
（2）不经一番寒彻骨，怎得梅花扑鼻香。