HTML标签之元信息类标签

最新推荐文章于 2023-03-27 17:33:39 发布

「已注销」

最新推荐文章于 2023-03-27 17:33:39 发布

阅读量1.3k

点赞数

分类专栏： HTML学习笔记

本文链接：https://blog.csdn.net/h15882065951/article/details/54917152

版权

HTML学习笔记专栏收录该内容

15 篇文章 0 订阅

订阅专栏

<head>标签

< head>标签是所有文档元素的容器，它包含了文档的全部信息。

信息包括：

<meta>-文档元信息
<title>-文档标题，每个页面以备的且每个文档只能有一个标题。
<base>-所有链接的默认地址
<style>
<link>
<script>
<noscript>

<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="uft-8">
    <title>文档标题</title>
    <!--<base href="xxx" target="_blank">
    <link rel="stylesheet" src="xx.css">
    <style>

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

    </script>-->
  </head>
  <body>

  </body>
</html>

注：建议将JS脚本放于</body>标签前。将所有页面加载完成后再运行js脚本。

<meta>标签

<meta>标签定义元信息，包含页面的描述、关键字、最后的修改日期、作者及其它元信息。元信息不会显示在客户端，会被浏览器解析，元信息会被浏览器、搜索引擎（关键字）、以及其它web服务调用。

常用属性：

charset-定义文档的字符编码，常用的是"utf-8"
content-定义与name和http-equiv相关的元信息
http-equiv--把content的内容关联到HTTP头部(content-type)
name-关联content的名称（常用的有：keyowrd关键字、author作者名、discriptiont页面描述）

<!DOCTYPE html>
<html lang="zh">
  <head>
    <!--对于HTML4.1 <meta http-equiv="content-type" type="text/html" charset="utf-8">-->
    <meta charset="utf-8">
	<meta name="keyword" content="html、css">
	<meta http-equiv="discription" content="html and css and javascript“>
	<meta http-equiv="author" content="tom">
	<meta http-equiv="refresh" content="30">  <!-- 第隔30s自动刷新一次页面 -->
	<title>a标签</title>
  </head>
  <body>
    
	主体内容
	
  </body>
</html>

注：在HTML5中有个新的"charset"属性：

对于HTML4.1： <meta http-equiv="content-type" type="text/html; charset=utf-8">
HTML5简为：<meta charset="utf-8">

<base>标签

<base>标签定义页面中所有相对链接的默认地址。如果使用了<base>标签，则必需有href或target或两者都有，<base>必需在<head>内部。

<!DOCTYPE html>
<html>
  <head>
    <base href="http://www.runoob.com//images/" target="_blank">
    <meta charset="utf-8"> 
    <title>菜鸟教程(runoob.com)</title>
  </head>
  <body>

    <p><img src="logo.png" > -注意这里我们设置了图片的相对地址。能正常显示是因为我们在 head 部分设置了 base 标签，该标签指定了页面上所有链接的默认 URL，所以该图片的访问地址为 "http://www.runoob.com/images/logo.png"</p>

    <p><a href="http://www.runoob.com/">runoob.com</a> - 注意这个链接会在新窗口打开，即便它没有 target="_blank" 属性。因为在 base 标签里我们已经设置了 target 属性的值为 "_blank"。</p>

  </body>
</html>

注：建议将<base>标签放在<head>元素的第一个子元素位置，这样<head>中的所有元素都可以使用<base>中的信息了。