html 全称是超文本标记语言,它是搭建网页最基础的标记语言,不是编程语言,本身没有逻辑运算循环判断这类编程能力,作用就是用来描述网页的结构,告诉浏览器页面里面哪里是标题哪里是段落哪里是图片哪里是表格哪里是链接。我们平时打开的所有网站页面,底层核心骨架都是 html,浏览器读取 html 代码之后,按照标签定义把内容渲染成用户可以看到的可视化网页。它诞生的初衷,就是解决跨文档文字图文跳转的需求,也就是超文本的概念,可以通过链接把不同文档互相串联起来,这也是 html 和普通纯文本文件最大的区别,现在 html 已经迭代到 html5 版本,支持音视频画布表单本地存储等大量新特性,是前端三大基础技术 html css js 当中的核心骨架。
核心基础概念
html 属于标记语言,核心组成单元就是标签,标签一般是成对出现,有开始标签和结束标签,也存在少量自闭合标签,不需要结束标签。标签可以嵌套使用,通过嵌套关系搭建出层级结构,形成一棵文档树,也就是 DOM 树,浏览器会把 html 解析成 DOM 对象,后续 css 用来美化样式,javascript 用来操作这个 DOM 树实现交互。
| 项目 | 说明 |
|---|---|
| 全称 | 超文本标记语言 |
| 类型 | 标记语言,不是编程语言 |
| 文件后缀 | html htm |
| 渲染载体 | 各类浏览器 |
| 当前主流版本 | html5 |
| 标准制定组织 | W3C WHATWG |
发展历史简要说明
1 早期起源 1990 年由蒂姆伯纳斯李设计,最初只是用来在科研网络里面共享文档,功能非常简单,只有少量基础标签
2 版本迭代 后续陆续推出 html2 html3 html4,不断增加表格表单框架等标签,但是早期版本兼容性很差,不同浏览器解析规则不一致
3 html5 发布 解决旧版本碎片化问题,移除已经废弃的标签,新增原生音视频画布语义化标签,不再依赖 flash 插件,成为现在通用标准
4 维护模式 现在 html 标准不再固定大版本静态更新,采用持续迭代的活标准模式,持续补充新特性
html 基础文档结构
一份标准 html 页面有固定基础骨架,最外层是 html 根标签,内部包含 head 头部区域和 body 主体区域。head 里面存放网页元信息,比如网页标题字符集编码页面描述,这些内容用户在页面上一般看不到。body 里面存放用户实际可见内容,文字图片链接表格表单全部写在 body 里面。
基础骨架要点
第一行声明文档类型,告诉浏览器使用 html5 标准解析页面
html 根标签包裹全部代码
head 区域配置元信息
body 区域放置页面可见内容
核心特点
1 跨平台 只要有浏览器,不管是电脑手机平板,都可以解析 html 代码
2 语法宽松 容错能力强,就算标签没有闭合,多数浏览器依旧可以尝试渲染页面,但是不推荐写不规范代码
3 语义化 html5 新增语义标签,比如 header main section article footer,标签本身带有含义,方便搜索引擎识别,也利于代码阅读维护
4 可扩展 可以搭配 css 控制外观,搭配 javascript 实现动态交互,还可以和其他后端技术结合,生成动态页面
容易混淆的知识点
很多新手会误以为 html 可以写逻辑判断循环,这个认知是错误的,html 只负责结构,动态逻辑需要 javascript 完成。css 只负责外观样式,不负责页面结构,三者分工明确,html 是骨架,css 是皮肤样式,js 是交互行为。html 代码不需要编译,浏览器直接读取源码解析,这一点和需要编译的编程语言不一样。
【常见问题】
问题 1 html 是不是编程语言
回答 1 html 不是编程语言,html 是超文本标记语言,只负责网页结构描述,没有编程逻辑运算能力。
问题 2 html 简介里面提到的 html5 是什么
回答 2 html 简介里面介绍的 html5 是 html 当前主流版本,新增音视频画布语义化标签,是现在网页开发通用标准。
问题 3 学习 html 之后还需要学习别的技术吗
回答 3 学习 html 只是前端第一步,完整网页开发还需要搭配 css 美化页面,搭配 javascript 实现交互,html 只搭建页面骨架。
问题 4 html 文件可以直接双击打开吗
回答 4 html 文件可以直接双击使用浏览器打开,html 不需要编译,浏览器可以直接解析渲染 html 页面。
【免责申明】
本文内容基于公开 W3C 标准资料整理,仅用于 html 入门科普学习,标准会持续更新,部分新特性浏览器支持情况存在差异,实际开发请参考官方最新规范文档。


