re:从0开始的HTML学习之路 2. HTML的标准结构说明

1. <DOCTYPE html>

文档声明,用于告诉浏览器,当前HTML文档采用的是什么版本。

必须写在当前HTML文档的首行(可执行代码的首行)

HTML4的此标签与HTML5不同。

2. <html lang="en">

根标签,整个HTML文档中所有标签都必须包裹在HTML根标签中

lang:用于说明当前文档使用的语言。如:en为英文,zh-CN为中文,这个标签会影响浏览器的翻译提示,如果浏览器默认为中文,网页lang=en,那么Chrome就会弹出一个翻译提示(其实并不重要~)

3. <head>

头部标签,通常不会在网页中直接显示。用于描述当前HTML文档的信息。

如:文档的标题,与其它文档的关系,文档的样式等。

meta:用来设置网页的元数据(描述数据的数据,比较重要)

html 复制代码
<meta charset="UTF-8">:用于表述当前文档使用的字符集,避免乱码。

编码:字符 → \rightarrow →二进制

解码:二进制 → \rightarrow →字符

字符集: A S C I I , G B K 2312 , I S O 8859 − 1 , U n i c o d e ASCII,GBK2312,ISO8859-1,Unicode ASCII,GBK2312,ISO8859−1,Unicode等,其中UTF-8是针对Unicode的可变长编码,是主要应用的编码。如果编码和解码方式不同也会乱码,所以大家都用UTF-8~

除此之外,meta还可以写很多东西,如keywords,description具体功能不再描述,与SEO搜索引擎优化相关

title:文档的标题,title的内容显示在浏览器的标题栏上

如下所示:

将来学的CSS等等都会放在head中引入

4. <body>

页面的主题,页面中所有可见的内容,都写在body标签中

相关推荐
UIU1148 分钟前
递归算法与汉诺塔
c++·学习·算法·c#·递归
10年前端老司机31 分钟前
Next.js+LangGraph.js+ 简历工具AI Agent完整落地
前端·langchain·agent
IT_陈寒5 小时前
Java中equals方法比了个寂寞?原来这才是正确的重写姿势
前端·人工智能·后端
默_笙5 小时前
🚓 分诊台与拆题术:让 RAG 学会判断和规划
前端·javascript
CopyCode5 小时前
用 AI 迁项目有多爽?我把 Webpack 迁 Vite 的全过程记下来了
前端·架构
去伪存真5 小时前
Electron 自动化发布指南:GitHub Actions 跨平台打包全纪录
前端·electron
计算机魔术师5 小时前
OpenAI智能体失控闯进美国政府网站,53张用户图片外泄背后
前端
颜进强5 小时前
14 · NestJS ExecutionContext 执行上下文:守卫、拦截器、过滤器拿到的"同一个 context",为什么能力不一样?
前端·后端·ai编程
程序员Flycan5 小时前
🚀 跨域终结者:前端代理服务器(Proxy)原理解析与配置总结
前端
怕浪猫5 小时前
顶级模型一句话,AI 写出了能玩的 QQ飞车
前端·面试·github