什么是HTML
英文全称：Hyper text Markup language
一个页面就是一篇文档
一篇文档最核心的就是内容，不同含义的内容组成了文档的结构
根据W3C（万维网联盟，是国际最著名的标准化组织）HTML指的是超文本标记语言，它是用来描述网页的一种编程语言，用于定义文档的内容结构。
2008年HTML5草案发布，2012年逐渐形成稳定版本。
HTML5中新增了语义化标签和属性，去掉了纯展示的标签，添加了canvas，video，audio，本地储存，拖拽等。
什么是CSS
英文全称：Cascading style sheets
CSS是页面表现的基础，可以控制布局，控制元素的渲染，用于定义HTML的样式。
中文全称：层叠样式表
HTML术语：
HTML注释的书写格式：<！--注释内容-->
写注释的理由：方便维护，阅读，工作交接
注释是写给开发者，维护者，浏览器，搜索引擎看的
注释的作用：描述代码功能
HTML元素
- 组成部分：<起始标记>元素内容</结束标记>
属性：附加信息
格式：属性名=”属性值”
2.空元素：没有结束标记和元素内容
空元素的格式：
<标记名 属性>
<标记名 属性/>
3.元素的层次结构：
一个元素中的内容中可以包含其他元素（完整元素），形成嵌套的层次结构
但两个元素之间不能嵌套
素一般有三种关系：父子，兄弟，祖先后代（元素之间必须要有嵌套或者包含关系）
CSS术语
CSS注释：
书写格式：/*注释内容*/
CSS注释主要用于描述代码功能
浏览器解析CSS代码时会忽略注释内容
仅注释中可以出现中文，CSS文件中不能出现中文
CSS规则：选择器与声明块组成CSS规则
h1{color:red;text-align:center}
h1为选择器（该样式规则应用到哪些元素上）（选择器包括元素选择器，类选择器，ID）
括号内为声明块
color为属性名，red为属性值
CSS与HTML关联的三种方法
1.外部样式表：<link rel="stylesheet" href="">
rel表示连接文件的类型
href表示连接文件的位置（路径）
2.内部样式表：<style></style>
3.行内样式表：直接书写在元素上：<div style=""> </div>
分析：
CSS外部样式表分析
- 结构与表现的代码完全分离
- 方便复用及维护
- 让HTML文件大小减少，从而让页面结构更容易被程序员和网络爬虫读懂
- 对搜索引擎友好，让搜索引擎给页面评分更高，有利于页面搜索引擎排名
- 外部样式表在用户首次访问后就被缓存在用户电脑上，下次访问无需加载
- 缺点：如果样式很多，css文件会变得很大查找不方便。此外多一个css文件就会多一次http请求，在访问量大的网站中会加重服务器的压力
CSS内部样式表分析
- 优点是减少了一个文件也就减少了一次http请求
- 导致HTML页面不纯净，文件体积大，不利于网络爬虫获取信息，不利于维护，页面之间无法共享样式
CSS行内样式表分析：没有了样式表文件，在某些时候可以提升效率
元素选择器：
书写格式：标记名（元素名，标签名）{声明块}
行内元素在设置宽高时无效
类选择器：
书写格式：.类名{声明块}
类名书写规范：
- 类名全英文状态下的字符，以英文字母开头，可以以数字或者其他字符（“-”“_”）结尾
- 大小写敏感（规范大小写）
- 见名知意（英文单词）
ID选择器：
书写格式：#id{声明块}
id是一个唯一值
子级选择器：
书写格式：父元素>子元素{声明块}
前提：嵌套关系
HTML常用元素：
文本元素：
h1--h6：一级标题到六级标题
strong：重要的文本
b：应突出显示的文本
p：段落
em：强调的文本
i：应区别对待的文本
blockquote：大段引用，效果是自动往中间缩紧
q：小段引用，效果是自动添加引号
cite：文献引用，效果斜体（css斜体样式：font-style：italic）
abbr：表示某个词汇的缩写，效果是自动添加点虚线
pre：预格式化，应用场景：数学公式 化学公式，效果是保留文本中的空格和回车
time：表示时间
input：输入框
mark：突出文本，效果是自动添加背景色
sup：上标，元素内容显示在父元素上方
sub：下标，元素内容显示在父元素下方
a标签:
a标签表示一个超链接
元素内容：表示要在页面上显示立即进入
Href属性：用户点击之后会跳转到超链接设置页面
a元素为行内元素（共享一行）
- 外部链接
- 设置锚点
- 功能链接
跳转路径：
target_self 在当前标签页直接打开
target_blank 在新的标签页中打开
绝对路径书写格式：协议//域名/目录
站外资源：绝对路径
站内资源：绝对路径（网站已部署可以省略协议和域名）， 相对路径
实体字符：
（代表空格）
<（小于符号）
>（大于符号）
&（并且符号）
©（版权符号）
®（注册符号）
单位：
- px：绝对单位
- em：相对单位，相对于元素本身
- rem：相对于根元素的尺寸
HTML补充知识点：
<!DOCTYPE html>：告知浏览器是以哪个版本来解析html元素，必须放在第一行。标注接下来代码的功能，文档声明定义。
document：文档 type：类型
如果DOCTYPE缺失或者错误时会出现怪异模式
head元素：
- 又叫文档头，是HTML元素的第一个子元素
2.包含所有元元素
<meta http-equiv="X-UA-Compatible" content="ie=edge">：
设置浏览器使用什么模式的渲染页面
1808
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
