HTML5系列 01 基础介绍

最新推荐文章于 2022-01-23 17:03:39 发布

云崖先生

最新推荐文章于 2022-01-23 17:03:39 发布

阅读量121

点赞数

分类专栏： HTML5

本文链接：https://blog.csdn.net/weixin_43422005/article/details/118701650

版权

本文是HTML5系列的开篇，介绍了HTML的基础知识，包括浏览器的作用、文档树的概念、文档声明的意义、标签类型（如内联和块级标签）、属性的使用，以及文档渲染规则等。强调了Chrome浏览器对于前端开发的重要性，以及规范的缩进习惯。

摘要由CSDN通过智能技术生成

基础介绍

HTML全称为htyper text markup language，即超文本标记语言。

超文本：即超出了纯文字文本的范畴，它可以包含图片、链接、音乐等非文字元素
标记语言：由标签构成的语言，特点是学习简单上手容易

它最早诞生于1990年，由物理学家蒂姆·伯纳斯-李所创建，在1989年的时候蒂姆·伯纳斯-李就曾在一份备忘录中提出一个基于互联网的超文本系统这样的概念，并且在1990年规定出了HTML并在同年写出了浏览器与软件：

版本	年份
HTML	1991
HTML+	1993
HTML 2.0	1995
HTML 3.2	1997
HTML 4.01	1999
XHTML 1.0	2000
HTML5	2012
XHTML5	2013

浏览器的作用

其实我们平时上网的过程就是一个不断上传、下载的过程。

浏览器会将我们输入的网址进行解析并请求服务器，服务器将资源返回后浏览器再将资源进行渲染并展示，最终构成了五彩缤纷的页面。

这里推荐大家统一使用Chrome浏览器，它应该算是目前前端开发人员首推的浏览器。

无论是渲染、调试等都是十分方便的，你可以打开浏览器后按f12得到控制台，在这里你可以做任何你想做的事。

而关于IDE的选择就有很多，你可以使用webstorm或者vscode。

认识文档树

我们拿一段最简单的HTML举例，可以暂时不用管他的内容，只看它的结构：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
        <h1>HELLO WORLD</h1>
    </div>
</body>
</html>

通过观察上面的这一小段代码，可以看出一个标准的HTML文档内容至少包含三部分，分别是最外部的<html>标