白骑士的HTML教学基础篇 1.1 HTML简介

白骑士所长

已于 2024-08-23 11:03:07 修改

阅读量692

点赞数 28

分类专栏： HTML 教学文章标签： html 前端

于 2024-08-17 00:03:33 首次发布

本文链接：https://blog.csdn.net/JeremyTC/article/details/141001324

版权

教学同时被 2 个专栏收录

300 篇文章 3 订阅

订阅专栏

HTML

21 篇文章 0 订阅

订阅专栏

系列目录

上一篇：无内容

在现代互联网的世界里，HTML（HyperText Markup Language）是所有网页的基础语言。无论是简约的个人博客还是复杂的商业网站，HTML都扮演着不可或缺的角色。掌握HTML是学习前端开发的第一步，这不仅能够帮助你构建静态网页，还能为后续学习CSS和JavaScript等前端技术打下坚实的基础。

什么是HTML？

HTML，全称HyperText Markup Language，即超文本标记语言。它是一种用于创建网页和Web应用的标准标记语言。HTML使用一系列标签（tags）来描述网页的结构和内容，这些标签告诉浏览器如何显示网页元素。每个标签通常成对出现，包含一个开始标签和一个结束标签。例如：

<p>这是一个段落。</p>

在上述例子中，‘<p>‘是段落标签，它包围的内容将被浏览器显示为一个段落。

HTML的历史与发展

HTML最早由Tim Berners-Lee于1989年提出，他当时在欧洲核子研究中心（CERN）工作。最初的HTML版本相对简单，仅包含少量的标签，主要用于描述文本、链接和图像。随着互联网的快速发展，HTML不断演进，增加了许多新功能和新标签，以适应日益复杂的网页需求。

HTML 1.0（1991年）：首个公开版本，功能非常基础。
HTML 2.0（1995年）：引入了一些新的标签和属性，标准化了之前的非正式扩展。
HTML 3.2（1997年）：加入了对表格、脚本和样式表的支持。
HTML 4.01（1999年）：引入了更多的结构性元素和属性，强调了网页的语义化。
XHTML（2000年）：作为HTML的严格版本，要求更为严格的标签使用规则。
HTML5（2014年）：当前的主要版本，增加了许多新元素和API，增强了多媒体支持和复杂应用开发能力。

设置HTML开发环境

在开始编写HTML代码之前，需要设置一个合适的开发环境。虽然可以使用任何文本编辑器来编写HTML代码，但使用专业的代码编辑器能大大提升编码效率和舒适度。

选择代码编辑器

一些常见的代码编辑器包括：

Visual Studio Code：微软开发的一款免费开源的代码编辑器，具有丰富的插件支持。
Sublime Text：轻量级、高性能的代码编辑器，支持多种编程语言。
Atom：由GitHub开发的一款开源编辑器，具有强大的自定义功能。

安装代码编辑器

以Visual Studio Code（VS Code）为例：

访问VS Code官网。
下载适用于你操作系统的安装包（Windows、macOS或Linux）。
安装并启动VS Code。

创建HTML文件

在VS Code中，创建一个新的HTML文件非常简单：

打开VS Code，点击左侧的文件图标，选择“新建文件”。

在文件中输入以下基本HTML代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的第一个网页</title>
</head>
<body>
    <h1>欢迎来到我的第一个网页</h1>
    <p>这是一个段落。</p>
</body>
</html>

保存文件，文件名为‘index.html‘。

预览HTML文件

保存文件后，可以在浏览器中打开‘index.html‘文件来预览效果。大多数代码编辑器都支持直接在编辑器中预览HTML文件，在VS Code中，可以安装Live Server扩展，实现实时预览。

总结

通过本篇博客，你了解了HTML的基本概念、发展历史以及如何设置HTML开发环境。HTML是网页开发的基础，掌握HTML能够为你后续学习前端技术打下坚实的基础。在下一篇文章中，我们将深入探讨HTML的基本语法和常用标签，帮助你更好地理解和应用HTML。欢迎继续关注我们的HTML系列教程，开启你的网页开发之旅！

下一篇：白骑士的HTML教学基础篇 1.2 HTML基础语法