欢迎了解HTML标签

欢迎了解HTML标签

这是我人生的第一篇博客,听取了学长的建议,写下了这篇文章。

<!DOCTYPE>是标签吗?有什么作用?


<!DOCTYPE>不是HTML标签,它为浏览器提供一项信息(声明),即 HTML 是用什么版本编写的。HTML 有多个不同的版本,只有完全明白页面中使用的确切 HTML 版本,浏览器才能完全正确地显示出 HTML 页面,它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。这就是 <!DOCTYPE>的用处。

用法

<!DOCTYPE>声明必须是 HTML 文档的第一行,位于 html 标签之前。

具体用法查看HTML<!DCOTYPE>

head标签作用以及它可以包含哪些标签

head

head标签是网页的HEAD(头)部分中包含有的内置标签,一般用来申明使用的脚本语言,以及网页传输时使用的方式等。

  • <head> 标签用于定义网页文档的头部,它是所有头部元素的容器。
  • <head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

包含的标签及作用

这些标签可用在 head 部分:<base>, <link>, <meta>, <script>, <style>, 以及 <title>。

  • <title>   元素可定义文档的标题。<title> 标签是 <head> 标签中唯一要求包含的东西。浏览器会以特殊的方式来使用标题,并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样,当把文档加入用户的链接列表或者收藏夹或书签列表时,标题将成为该文档链接的默认名称。
  • <link>   链接外部样式表。link 元素是空元素,它仅包含属性。此元素只能存在于 head 部分,不过它可出现任何次数。
  • <style>    用于为 HTML 文档定义样式信息。type 属性是必需的,定义 style 元素的内容。唯一可能的值是 “text/css”。
  • <meta>    可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。
  • <base>    为页面上的所有链接规定默认地址或默认目标。
  • <script>    标签用于定义客户端脚本,比如 JavaScript。script 元素既可以包含脚本语句,也可以通过 src 属性指向外部脚本文件。

meta标签的属性值可以有哪些

必须的标签

  • content          值   some_text

可选的属性

  • http-equiv     值   content-type、 expires、 refresh、 set-cookie
  • name             值   author、description、keywords、generator;
                                 revised、others
  • scheme         值    some_text

可详细参考文章:HTML<meta>常用属性值的写法总结与使用介绍

HTML语义化

什么是语义化

  • 根据内容的结构化(内容语义化),选择合适的标签(代码语义化),让标签有自己的含义。

语义化的好处

  • 为了在没有CSS的情况下,页面也能呈现出很好地内容结构、代码结构

  • 用户体验:例如title、alt用于解释名词或解释图片信息的标签尽量填写有
                      含义的词语、label标签的活用

  • 有利于搜索引擎SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多
                                        的有效信息;爬虫依赖于标签来确定上下文和各
                                        个关键字的权重

  • 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以有意义的方式来渲染网页

  • 便于团队开发和维护,语义化更具可读性,遵循W3C标准的团队都遵循这个标准,可以减少差异化

常见的语义化标签

扩展

HTML发展的历史阶段

在这里插入图片描述

HTML发展历史(感兴趣的同学可以点进去看看)

这篇博客写到这里就结束啦,谢谢大家的观看,以上提供的链接都很有意义,大家可以去看一下大佬们的博客。

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值