2025/3/28
向全栈工程师迈进！
一、看基本HTML
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8" /><title>我的测试页面</title></head><body><p>这是我的页面</p></body>
</html>
整体主要包含head元素，body元素。在head元素中，其里面的内容是不会在浏览器中显示，他的作用就是保存页面的一些元数据。
1.1"头里"可添加title 元素
title 中的内容会被显示在网页的上方，如上面的看基本HTML代码中，其就会显示为“我的测试页面”
1.2 "头里"可添加Meta 元素
元数据是描述数据的数据，而 HTML 有一个“官方的”方式来为一个文档添加元数据——<meta> 元素。
<meta charset="utf-8" />
指定数据使用 utf-8 通用的字符集。
当然meta元素也可以这样使用
<meta name="author" content="cg5017"/>
<metaname="description"content="这个网页告诉我们要好好学习，天天向上"/>
1.3 "头里"可在你的网站增加自定义图标
为了进一步丰富网站设计，可以在元数据中添加对自定义图标的引用，它们会在某些场景下显示。最常见的用例为 favicon（为“favorites icon”的缩写，在浏览器的“收藏夹”及“书签”列表中显示）。
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<%= BASE_URL %>是一个模板语法占位符，在前端项目构建时会被实际的基础 URL 所替换。
几乎现在所使用的所有网站都会使用CSS来让网页更加炫酷，并使用JavaScript来让网页有交互功能，比如视频播放器、地图、游戏以及更多功能。这些应用在网页中很常见，它们分别使用<link>元素以及<Script>元素。
1.4 "头里"可在HTML中应用CSS和JavaScript
1.4.1 link 元素引入CSS
<link rel="stylesheet" href="my-css-file.css" />
href是包含了样式表文件路径 rel = "stylesheet" 表明这是文档的样式表。
1.4.2 script 元素引入JavaScript
<script src="my-js-file.js" defer></script>
包含 src 属性来指向需要加载的 JavaScript 文件路径，同时最好加上 defer 以告诉浏览器在解析完成 HTML 后再加载 JavaScript。这样可以确保在加载脚本之前浏览器已经解析了所有的 HTML 内容。这样就不会因为 JavaScript 试图访问页面上不存在的 HTML 元素而产生错误。
1.5 为文档设置主语言 lang 属性
<html lang="zh-CN">…
</html>
在html文件中设置 lang="zh-CN" 表明整个网页的主要语言为中文，设置相应的lang属性是非常重要的，对于那些使用屏幕阅读器的视障人士也很有用（例如，法语和英语中都有“six”这个单词，但是发音却完全不同）。所以在书写某些内容的是，可以在标签内部加上lang属性。
山高路远，慢慢走
别慌，别慌，别慌………
