前言
本文讲解了 HTML 语法规范 HTML 基本结构标签开发工具 HTML 常用标签 HTML 中的注释和特殊字符,
如果本文对你有所帮助请三连支持博主,你的支持是我更新的动力。
以下是本篇文章正文内容
一、HTML 语法规范
什么是HTML
HTML是做网站的、Web开发、互联网生态开发(PC端+移动端+微应用) 目前我们使用的都是HTML5,支持传统的PC端开发,还支持移动端开发还支持微应用开发,从而替换了部分传统的移动端开发技术
1.1 基本语法概述
HTML 标签是由尖括号包围的关键词
HTML 标签通常是成对出现的我们称为双标签。标签对中的第一个标签是开始标签,第二个标签是结束标签。
有些特殊的标签必须是单个标签(极少情况),例如 br ,我们称为单标签。
1.2 标签关系
双标签关系可以分为两类:包含关系和并列关系。
包含关系
<head> <title> </title> </head>
并列关系
<head> </head> <body> </body>
二、HTML 基本结构标签
2.1 第一个 HTML 网页
每个网页都会有一个基本的结构标签(也称为骨架标签),页面内容也是在这些基本标签上书写。
HTML页面也称为 HTML 文档
<html> <head> <title>我的第一个页面</title> </head> <body> 你一飞冲天 </body> </html>
HTML 文档的的后缀名必须是 .html 或 .htm
,浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。此时,用浏览器打开这个网页,我们就可以预览我们写的第一个 HTML 文件了。
2.2 基本结构标签总结
<!DOCTYPE html> <!--DOC 代表 文档 TYPE type 类型 --> <!-- 文档声明 1. 告诉浏览器页面当前使用的版本是 html5 必须声明在网页开头 2. 不写文档声明,会导致浏览器 进入怪异模式,导致有些浏览器无法正常解析页面 --> <html lang="en"> <!-- lang="en" 叫属性 属性名="属性值"--> <!--根标签 一个页面中只有一个根标签 所有内容都要写在这个根标签里--> <!-- lang 对应单词: language 语言 用来定义当前文档显示的语言 en: 对应单词 :english 英文 表示当前网站是 英文网站 zh/ zh-CN 对应单词 :chinese 中文 表示当前网站是中文网站 设置目的:让搜索引擎知道我们是中文网站还是英文网站, 搜索时可能将对应语言的页面搜索出来 --> <head> <!--head 帮助浏览器来解析页面,不会显示在网页内容中--> <meta charset="utf-8" /> <!--"utf-8" 浏览器和计算机之间互相读取信息时 需要同一个密码本(gb2312、gbk、utf-8) 而浏览器默认的 密码本是: gb2312 它是属于中国 gbk 中国 在简体的基础上增加了繁体 utf-8: 国际 全球通用 --> <title> HTML结构 </title> <!-- title 1. 设置浏览器的标题 2. 搜索引擎会先抓取title里的内容展示给用户,并且这个内容的设置会影响到 3. 页面在搜索引擎的排名 比如:百度搜索 --> </head> <body> <!--来显示页面的内容--> 我是网页的内容 </body> </html>
三、开发工具
HTML的IDE工具
(1) DW(Dreamweaver)
(2) HBuilder
(3) Subline
(4) VSCode
(5) WebStorm
(6) 记事本
(7) 其他编程语言的IDE工具
VSCode 的使用
双击打开软件。
新建文件(Ctrl + N )。
保存(Ctrl + S ), 注意移动要保存为 .html 文件
Ctrl + 加号键 ,Ctrl + 减号键 可以放大缩小视图
生成页面骨架结构。输入! 按下 Tab 键。
利用插件在浏览器中预览页面:单击鼠标右键,在弹出窗口中点击“Open In Default Browser”。
VSCode 工具生成骨架标签新增代码
7. <!DOCTYPE> 标签
8. lang 语言
9. charset 字符集
3.1 文档类型声明标签
文档类型声明,作用就是告诉浏览器使用哪种HTML版本来显示网页
注意:
声明位于文档中的最前面的位置,处于 <html> 标签之前。
<!DOCTYPE>不是一个 HTML 标签,它就是 文档类型声明标签。
3.2 lang 语言种类
用来定义当前文档显示的语言。
en定义语言为英语
zh-CN定义语言为中文
简单来说,定义为en 就是英文网页, 定义为 zh-CN 就是中文网页
其实对于文档显示来说,定义成en的文档也可以显示中文,定义成zh-CN的文档也可以显示英文
这个属性对浏览器和搜索引擎(百度.谷歌等)还是有作用的
3.3 字符集
字符集 (Character set)是多个字符的集合。以便计算机能够识别和存储各种文字。 在<head>标签内,可以通过<meta> 标签的 charset 属性来规定 HTML 文档应该使用哪种字符编码。
<meta charset=" UTF-8" />
charset 常用的值有:GB2312 、BIG5 、GBK 和 UTF-8,其中 UTF-8 也被称为万国码,基本包含了全世界所有国家需要用到的字符.
注意:上面语法是必须要写的代码,否则可能引起乱码的情况。一般情况下,统一使用“UTF-8”编码,尽量
统一写成标准的 “UTF-8”,不要写成 “utf8” 或 “UTF8”。