这是我参与「第五届青训营」伴学笔记创作活动的第 1 天

一、整体切入大局浏览：

HTML5

认识WEB

**「网页」**主要是由文字、图像和超链接等元素构成，当然除了这些元素，网页中还可以包括音频、视频以及Flash等。

**「浏览器」**是网页显示、运行的平台。

「浏览器内核」(排版引擎、解释引擎、渲染引擎)

Web标准

**「构成」**👉 结构标准，表现标准和行为标准

结构标准用于对网页元素进行整理和分类(HTML) 表现标准用于设置网页元素的版式、颜色、大小等外观属性(CSS) 行为标准用于对网页模型的定义及交互的编写(JavaScript) **「Web标准的优点」**👇

易于维护：只需更改CSS文件，就可以改变整站的样式页面响应快：HTML文档体积变小，响应时间短可访问性：语义化的HTML（结构和表现相分离的HTML）编写的网页文件，更容易被屏幕阅读器识别设备兼容性：不同的样式表可以让网页在不同的设备上呈现不同的样式搜索引擎：语义化的HTML能更容易被搜索引擎解析，提升排名

二、html详细知识点介绍：

HTML 简介

1、HTML是什么？ HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言，而是一种标记语言 (markup language) 标记语言是一套标记标签 (markup tag) HTML 使用标记标签来描述网页

2、什么是HTML标签？ HTML 标签是由尖括号包围的关键词 HTML 标签通常是成对出现的，例如和有些特殊的标签必须是单个标签，例如
标签对中的第一个标签是开始标签，第二个标签是结束标签

之前不熟悉的用法

「lang的作用」

根据根据lang属性来设定不同语言的css样式，或者字体
告诉搜索引擎做精确的识别
让语法检查程序做语言识别
帮助翻译工具做识别
帮助网页阅读程序做识别

字符集

「字符集」(Character set)是多个字符的集合,计算机要准确的处理各种字符集文字，需要进行字符编码，以便计算机能够识别和存储各种文字。

UTF-8是目前最常用的字符集编码方式让 html 文件是以 UTF-8 编码保存的，浏览器根据编码去解码对应的html内容。

三、CSS要点：

CSS是什么 CSS：Cascading Style Sheet 层叠级联样式表

    CSS作用：表现（美化网页）

            字体、颜色、边距、高度、宽度、背景图片、网页定位、网页浮动……

    CSS的优势：

            1、内容和表现分离

            2、网页结构表现统一，可以实现服用

            3、样式十分的丰富

            4、建议使用独立于html的css文件

            5、利用SEO，容易被搜索引擎收录！

按照CSS样式书写的位置，CSS可分为三大类：行内样式表（行内式）：在标签内部的stlye属性中设定CSS样式适合于修改简单样式,只可以控制当前标签的样式

	 <div style="color: red; font-size: 12px;"> 青训营 </div>

内部样式表（嵌入式）：写在HTML页面，放在标签中，一般放在标签中方便控制当前整个页面中的元素样式设置，代码结构清晰，但是并没有实现结构与样式完全分离

外部样式表（链接式）：单独写到CSS文件中，之后把CSS文件引入到HTML页面中使用新建一个CSS文件（后缀.css），在HTML页面中用标签引入这个文件

		      <link rel="stylesheet" href="css文件路径">

① 类选择器使用“.”*（英文点号）进行标识，后面紧跟类名（自定义，我们自己命名的）

② 可以理解为给这个标签起了一个名字，来表示

③ 长名称或词组可以使用中横线来为选择器命名

④ 不要使用纯数字、中文等命名，尽量使用英文字母来表示

⑤ 命名要有意义，尽量使别人一眼就知道这个类名的目的

伪类选择器

伪类选择器用于向某些选择器添加特殊的效果，比如给链接添加特殊效果，或选择第 n 个元素

伪类选择器书写最大的特点是用冒号（:）表示，比如 :hover、:first-child

伪类选择器很多，比如有链接伪装，结果伪装等

四、个人总结

任何一门学科都有相应的概念，网站建设也不例外。

HTML不单单是网页结构代码，而是一套超文本的理念，随着HTML5的兴起，它也不单单是超文本了，而是有语义的超文本，HTML也是可以有感情的。当然，这是网页背后的事，作为初学者，我只需要了解各个标签起到什么效果、使用时需要注意哪些，并不必掌握所有的标签，而是掌握到可以满足你的写作需求的那些标签。做好了这些，等以后慢慢即可接触更多的知识。
不要把CSS看的很难，因为太依赖写作工具软件，所以初学者会认为css很难，其实css是件很简单的事，就像一个人穿衣服一样，它让网页拥有不同的布局、颜色、线条、隐现。css=class的时代也过去了，随着HTML5的发展，css也变得开始有语义，有动作，可以实现一些动态的效果。
根据查找的资料 HTML5并不是HTML4的不同版本，而是一种新的理念，在HTML4的基础上增减了一些标签，如果你想要学习HTML+CSS，并不会太多的深入研究其他WEB技术的话，那么选择HTML5+CSS3是一项不错的决定，当然，学习HTML5会变得很困难，因为所有的HTML5的书籍都把读者当做是已经非常了解HTML+CSS+JavaScript的
总之万丈高楼平地起来第一天加油

前端与 HTML+CSS | 青训营笔记