【前端9】meta标签

【前端9】meta标签

Posted by LineXic on February 5, 2024

前言

本教程总结自作为前端,你必须要知道的meta标签知识发布,尚硅谷的有些看不太懂了😀

回顾

回顾之前先来写一下浏览器最标准的HTML格式

1
2
3
4
5
6
7
8
9
10
11
<!doctype html>
   <html>
 <head>
<meta charset="UTF-8">
  <title>简单的复习/总结</title>
</head>
  <boby>
  <!-- boby中写网页内容,如<h1>这样的标签 -->
<h1>HTML中的大标题</h1>
<boby>
</html>

其中doctype html用来告知浏览器使用HTML5编写 <html><head>是网页必写的标签它们都要有结束标签 <meat><title>都是写在<head>里的,作用分别是编辑网页信息和设置网页标题 而这篇文章就来详细说一说meat标签

meat标签

概览

MDN中是这样说的

HTML<meta>元素表示那些不能由其他 HTML 元相关(meta-related)元素表示的元数据信息。如:<base><link><script><style><title>

来看看meta定义的元数据类型

  • 如果设置了 name属性,meta元素提供的是文档级别的元数据,应用于整个页面。

  • 如果设置了http-equiv属性,meta元素则是编译指令,提供的信息与类似命名的HTTP头部相同 。
  • 如果设置了charset属性,meta元素是一个字符集声明,告诉文档使用哪种字符编码。

  • 如果设置了itemprop属性,meta元素提供用户定义的元数据。

我们其实只需要重点了解name就好

name属性

namecontent一起使用,前者表示元数据要表示属性后者表示元数据的

如果要表示网页开发的某一机构或者人就需要用到author,例如

1
<meta name="author" content="[email protected]">

description是一段简短而精确的、对页面内容的描述。以头条和taobao的description标签为例: pF81rwV.png pF81soT.png

keywords定义与页面内容相关的关键词,使用逗号分隔。某些搜索引擎在遇到这些关键字时,会用这些关键字对文档进行分类。还是以头条和taobao为例 CSDN_1707149423821

大概就是这么多了,这边在指路一下更多教程

  • 版权归©LineXic所有
  • BY-NC-SA许可协议保障权益
  • 你可以转载文章但必须标注文章来源
  • 不能将文章的任何劳动成果占为己有包括但不限于直接或间接的盈利!

☛兄dei,请我喝杯茶☚
%