一.今日学习内容
A.HTML简介
- 网页:网页就是网站中的一页，通常是HTML格式文件，它要通过浏览器来进行阅读
- 网站:就是使用HTML等内容制作的网页集合
- 什么是HTML
- HTML（Hyper Text Markup Language） 超文本标记语言，它是用来描述网页的一种标记语言
- 图片、声音、动画等内容（超越文本的限制）
- 超链接可以跳转到其他的网页（超级链接文本）
- 网页的解析过程：从服务器下载HTML文件到浏览器中进行解析并渲染成页面
B.常用的浏览器
- 六大浏览器：IE（微软）、edge（微软）、Firefox（火狐）、Chrome（谷歌浏览器）、Safari（苹果）、Opera。
- 浏览器内核
- 指的是浏览器最核心的部分，负责对网页的语法解释，渲染页面。
- IE（Trident） firefox（Gecko）、Safari（Webkit）、Chrome/Opera（Blink、其实是Webkit内核的分支）。
- 国内的浏览器一般都是使用Webkit或者Blink内核，所以我们后期考虑兼容性的时候也主要考虑这两个内核即可。
C.Web标准
- Web标准是由W3C组织和其他的一些标准化的组织指定一系列的网页标准。
- 为什么我们需要web标准：因为浏览器不同，解析出来的网页排版会有差异，所以如果没有标准，开发者就需要根据不同的浏览器开发不同的网页，工作量巨大，有了WEB标准，那么针对不同的浏览器只需要一套网页即可。
- Web标准主要包括
- 结构：结构用于对网页元素进行整理和分类，主要使用HTML
- 表现：用于设置网页元素的板式、颜色、大小等外观样式。主要使用css
- 行为：行为指的是网页中的交互内容，现阶段主要学习的是JavaScript
D.HTML的语法规范
- 标签组成：HTML的标签是由尖括号包围的关键词组成的，例如<html>
- 成对出现：HTML的标签通常是成对出现的，比如<html></html>，称之为双标签。标签中的第一个标签是开始标签，第二个标签是结束
- 单标签：有一些特殊的标签必须是单标签（情况较少），例如<br>标签，就是一个单标签
E.HTML的基本结构标签
- <html></html>标签是页面中最大的标签，也叫做根标签
- <head></head>标签是页面的头部标签，其中必须要写的标签是<title></title>
- <title></title>页面的顶部区域标题的内容，让页面能有一个自己的标题
- <body></body>页面中的主体内容都是放在body标签中的
F.HTML的文档的后缀
- HTML的文档后缀必须是.html或者.htm，浏览器的作用是读取HTML文档，并通过内核渲染显示内容
G.开发工具
- Dreamweaver、Sublime、WebStorm、Hbuilder、VSCode
- VSCode
- 基本使用
- 新建文件 Ctrl + N
- 保存Ctrl+s， 保存文件的时候文件名要以.html结尾
- ctrl + 加号 和 ctrl+减号可以放大或者缩小视图
- 生成页面的骨架标签：输入英文感叹号“!” 按下tab键即可
- 利用插件在浏览器中预览页面，右键点击鼠标，选择open in default Browser
- alt+shift+f 快速格式化代码
- alt+shift+下键 快速复制上一行代码
H.骨架新增标签
- 是DTD文档类型定义
- DTD文档声明：应该有什么样的标签，标签之间应该如何进行排列，标签应该有什么属性，校验文档是否复合DTD文档类型定义的规范
- 这个声明就是告诉浏览器使用HTML5的标签来显示网页
- 注意点：DTD文档定义代码应该要写在HTML文件的最前面，DTD不是HTML的标签，是另一种专门来定义标签语言的语言
- 用来定义当前文档的显示语言：en代表是英语，zh-CN定义语言为中文，但是目前不管是定义成中文还是英文，浏览器对于这两种语言都能正常显示。
- 字符集是多个字符的集合，方便计算机识别和存储各类文字
- 常用的字符集有：GB2312、GBK和UTF-8，其中UTF-8也被称为万国码，基本包括了全世界所有国家需要用到的字符。
- 例<meta charset=""UTF-8>
I.HTML常用标签
- 标签的语义
- 标题标签
- 段落标签
- 换行标签
- 文本格式化标签
- div标签和span标签
- 标签属性
- 图像标签
J.相对路径和绝对路径
- 相对路径：以我们当前的文件为其实参考点一级一级的建立目录路径
- ../代表上一级目录
- /代表下一级目录
- .代表当前目录
- 从盘符的根目录下开始一步一步的建立文件路径，和当前文件的路径是无关的
K.超链接
- 在html标签中使用<a></a>标签来定义超链接
- 超链接的语法
- a是单词anchor 意为锚
- 常用属性：href 用于指定链接目标的URL地址，是必须属性，target 用于指定链接页面的打开方式，如果是默认值"_self"，代表在当前页面打开，如果是“_blank”，代表在新窗口中打开页面
- 外部链接
- 内部链接，网站内部的页面跳转用到的就是内部链接，直接写网站内部的页面名称即可
- 空链接，如果没有确定目标链接时，可以暂时用空链接来代替
- 下载链接，当链接的地址是一个文件或者压缩包时，点击之后会直接下载相关内容
- 网页元素链接，页面中的各种元素，比如图片、视频、音频等等，都可以作为超链接使用
- 锚点链接，当我们点击链接时，可以快速定位到当前页面中的某一个位置：第一步：在链接中的href属性中设置属性值为 #名字 的形式，第二步：在目标位置的标签中添加id属性，属性值写成刚才# 后面的名字即可
L.base标签
- 语法规范：<base href="跳转的目标" target=“网页打开的方式”>
- base标签一般会写在<head></head>标签中，作用是对所有的相对链接规定一个默认的url地址，或者提供一个默认目标。
M.HTML的注释和特殊字符
- 如果需要在HTML文档中添加一些便于阅读和理解代码的内容，又不能在页面中进行显示，就需要用到注释
- HTML中注释标签的格式 <!-- 注释内容 -->
- 注释的快捷键是ctrl + /
- 在HTML页面中，一些特殊的符号只能用实体引用的方式来显示
- 实体引用是用“&”符开头，以“;”结尾，中间是实体引用的名称
- 常用特殊字符
|
