h1到h6标签|学习笔记

简介: 快速学习h1到h6标签

开发者学堂课程【HTML 基础入门学习h1到h6标签】学习笔记与课程紧密联系,让用户快速学习知识

课程地址https://developer.aliyun.com/learning/course/465/detail/5722


h1到h6标签

 

1.解释

<hx><hx/>x对应123456

此为成对的标签,有开始标签也有结束标签。

2.作用

定义标题文档的重点内容h1到h6 对应页面里的一些重要内容才会用标签。就像写作文一样,比较重要的题目、每一段的开始的第一句话,这些地方可能去使用这个标题。

h1是最大的标题, h6是最小的标题

3.优先级

6个标签数字数字越往前越重要。比如1表示其十分重要,常用h1-h3

基本上忽略h4-h6,因为不管是培训以及真实开发基本上没人用h4-h6,有些大公司连h3都很少用,所以常用h1-h3已然足够,表示一个优先级。

4.对应使用数量

(1)大体使用规定

一般情况下,一个页面最好仅使用一个h1h2可以有两三个h3在此基础上再稍微多一点由于一个页面所要表达的重点所要表达的功能仅有一个,h1使用一个就已足够

(2)h1数量限制的原因

一个页面放多个h1对 icu并不利,因为一个页面都是标题,如果操作引擎爬虫爬了一百个标题都是h1无法抓住内容的重点。故当页面只有一个h1,爬到h1时就会知道这个页面大概是干什么用的,更有利于搜索引擎将内容呈现给搜索的人。

5.存放位置

之前众多标签进行讲解时都必须置于head里面,而当前的标签基本上都是页面上可以看到的东西,都会放在body里面

如果没有声明这个标签必须放在那里,那么就是放在body里面,因为前面都是必须声明必须放在head里。

6.body

页面可以看到的结构。

7.举例

<!DOCTYPE html><html>

<head>

<title></title>

</head>

<body>

</body>

</html>

//将内容引入<body>:

<!DOCTYPE html><html>

<head>

<title></title>

</head>

<body>

<1>攻城课堂</h1>

<h3>攻城课堂的课程大纲</h3>

</body>

</html>

//保存刷新,文字是乱码这时候需要指明字符集:

<meta http-equivsu"" content-type“content="text/html;

charset=utf-8">

//乱码消除

//这时接着写入:<2>攻城课堂</h2><4>攻城课堂</h4><5>攻城课堂</h5>

//刷新,会发现最重要的字体越来越大,越往下越不重要的会越小。

//字体大小是浏览器默认的大小,即使不去设置样式,默认的h1最大。

8.注意

一定要重要的内容写在对应的h中,不能乱用h标签。

相关文章
|
网络协议 Shell Linux
【Shell 命令集合 网络通讯 】Linux 提供SMB共享 smbd命令 使用指南
【Shell 命令集合 网络通讯 】Linux 提供SMB共享 smbd命令 使用指南
1161 0
|
SQL 安全 数据挖掘
PHP表单的多方面应用与实践
通过本文的介绍,我们详细探讨了PHP表单的多方面应用与实践。从表单创建、数据验证、安全性、文件上传到多步表单处理,每个方面都有具体的示例和说明。通过掌握这些技术,开发者可以有效地处理表单数据,确保应用的安全性和可靠性。希望本文能为您在PHP开发中提供有价值的参考和指导。
140 2
|
前端开发 JavaScript 算法
java宝典(6)
java宝典(6)
292 0
|
3天前
|
数据采集 人工智能 安全
|
12天前
|
云安全 监控 安全
|
4天前
|
自然语言处理 API
万相 Wan2.6 全新升级发布!人人都能当导演的时代来了
通义万相2.6全新升级,支持文生图、图生视频、文生视频,打造电影级创作体验。智能分镜、角色扮演、音画同步,让创意一键成片,大众也能轻松制作高质量短视频。
1050 151
|
4天前
|
编解码 人工智能 机器人
通义万相2.6,模型使用指南
智能分镜 | 多镜头叙事 | 支持15秒视频生成 | 高品质声音生成 | 多人稳定对话
|
17天前
|
机器学习/深度学习 人工智能 自然语言处理
Z-Image:冲击体验上限的下一代图像生成模型
通义实验室推出全新文生图模型Z-Image,以6B参数实现“快、稳、轻、准”突破。Turbo版本仅需8步亚秒级生成,支持16GB显存设备,中英双语理解与文字渲染尤为出色,真实感和美学表现媲美国际顶尖模型,被誉为“最值得关注的开源生图模型之一”。
1735 9
|
9天前
|
人工智能 自然语言处理 API
一句话生成拓扑图!AI+Draw.io 封神开源组合,工具让你的效率爆炸
一句话生成拓扑图!next-ai-draw-io 结合 AI 与 Draw.io,通过自然语言秒出架构图,支持私有部署、免费大模型接口,彻底解放生产力,绘图效率直接爆炸。
683 152