HTML学习笔记（1）

程序源⠀

已于 2023-01-05 10:32:48 修改

阅读量55

点赞数

分类专栏：寒假学习笔记文章标签： html

于 2023-01-01 22:25:17 首次发布

本文链接：https://blog.csdn.net/weixin_73609038/article/details/128508634

版权

寒假学习笔记专栏收录该内容

11 篇文章 0 订阅

订阅专栏

一.HTML认知

1.认识网页

网页是一个包含HTML标签的纯文本文件。简单的说，网页就是我们打开浏览器所看见的页面，网页由我们所看见的文字、图片、视频音频、超链接这些组成。

网页的本质其实就是前端程序员写的代码。而这些代码，通过浏览器的转化（解析、渲染），呈现出我们所看到的网页的样子。在页面任意处点击鼠标右键，点击检查选项，可以看到这个网页背后的代码。

2.HTML是什么

HTML，“Hyper Text Markup Language”，叫做超文本标记语言，是一门标记语言，并不是编程语言。HTML是专门用于网页开发的语言，主要通过HTML标签对网页中的文本、图片、音频、视频等内容进行描述。

3.web标准

不同的浏览器渲染引擎不同，对相同代码的解析效果会存在差异，为了解决这个问题，于是有了web标准，web标准让不同的浏览器按照相同的标准显示结果，让展示的效果统一。

web标准分为三个构成

构成	语言	说明
结构	HTML	网页元素和内容
表现	CSS	网页元素的外观和位置等页面样式（颜色、大小等）
行为	JavaScript	网页模型的定义与页面交互（页面动态效果）

4.构建基本网页

新建一个文本文档，将文本文档后缀名改为html，打开之后就是一个网页页面了

在文本文档中编写的东西会出现在网页中（但是写代码并不是用这种方式）

5.开发工具

在记事本中，完全可以编写网页源代码，但这种方式的效率太低。

实际开发过程中要注重效率和简便性，常见的开发工具有：VS Code（推荐）、Webstorm、Sublime、Dreamweaver、Hbuilder

ps：vscode安装以及使用（b站）

https://www.bilibili.com/video/BV1kR4y1M7R8?vd_source=ff53a726c62f94eda5f615bd4a62c458

或者可以使用菜鸟教程的在线编辑HTML/CSS/JS 在线工具 | 菜鸟工具

6.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>这是网页标题</title>
</head>
<body>
    这是网页主体内容
</body>
</html>