前端之路(四)—— HTML中的元数据

  • 上篇我们初识HTML,在这篇我们解析了HTML文档,其中有head标签,这里面可以包含很多东西,今天我们就一起来探讨一下。

<head>元素

<head>元素中的内容不会在页面中展示,它的作用是为了保存元数据。

元数据:用来描述数据的数据。比如包含该文件的作者和概要,还有网页的标题。

<meta>元素

<meta>元素,用来为HTML添加元数据,下面我们来了解一下常见的类型。

  • <meta charset=“utf-8”>: 指定文档中的字符的编码,utf-8是通用符,如果想要其他的可以设置,达到我们想要的结果。
  • name、content:用来添加作者和描述。name指定了meta元素的类型 content指定了实际的元数据内容。
<meta name="author" content="Chris Mills">

自定义图标

在我们浏览页面的时候,浏览栏上除了标题还有图标,公司网页也会自定义自己的图标,展示公司风采。

图标的引入也是在head标签里面

<link rel="icon" href="./favicon.ico" />
href:图标的路径

引入文件

后续我们会学习样式css来装扮我们的网页,首先我们在head里可以用style标签直接来写css文件。

<style>
.html{
 font-size:20px
}
</style>

但当样式过多时,不方便维护与复用,这时候我们可以把css样式单独写成.css文件,然后在需要用的页面直接引入就行,那么这时候就得学会如何引入css文件

  • <link>元素:位于文档头部,有两个属性。ref:表明文档类型、href表明路径。
<link rel="stylesheet" href="my.css">

 有了css,js肯定也少不了,js文件可以放在头部,但是一般我们会把它放到body元素的后面

<script src="my.js"></script>

为文档设定主语言

最后我们来了解一下怎么设置主语言,这里我们通过lang属性来添加,不同的语言我们可以通过lang属性来添加

<html lang="zh-CN"> //设置成中文
<p>日语: <span lang="jp">ご飯が熱い。</span>.</p> //设置成日文

不同语言的lang的属性值可以在这里找到code

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值