H5学习之13 head标签 (meta标签等)

来源：互联网发布：卫生间地面材料知乎编辑：程序博客网时间：2024/04/29 23:04

<!DOCTYPE html><html lang="en"><head>    <!--    <head> 元素是所有头部元素的容器。    <head> 内的元素可包含脚本，指示浏览器在何处可以找到样式表，提供元信息，等等。    以下标签都可以添加到 head 部分：    <title>、<base>、<link>、<meta>、<script> 以及 <style>。    -->    <meta charset="UTF-8">    <meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" />    <!--这一句的功能是 使得 页面5秒后 指向这个网址-->    <meta name="author" content="zs"><!--作者-->    <meta name="revised" content="zs，2016.7.31"><!--revised 英文意思是经过修正的-->    <meta name="generator" content="WebStorm"><!--编辑器，-->    <meta name="description" content="描述"/><!--关于文档的描述--><!--一些搜索引擎会利用 meta 元素的 name 和 content 属性来索引页面。-->    <meta name="keywords" content="学些H5"/><!--定义页面关键词-->    <!--    元数据（metadata）是关于数据的信息。    <meta> 标签提供关于 HTML 文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。    典型的情况是，meta 元素被用于规定页面的描述、关键词、文档的作者、最后修改时间以及其他元数据。    <meta> 标签始终位于 head 元素中。    元数据可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。    -->    <title>       这是标题哦~！    </title>    <!--        <title> 标签定义文档的标题。        title 元素在所有 HTML/XHTML 文档中都是必需的。        title 元素能够：        定义浏览器工具栏中的标题        提供页面被添加到收藏夹时显示的标题        显示在搜索引擎结果中的页面标题        -->    <base href="https://www.baidu.com/?tn=95505140_hao_pg"/>    <base target="_blank"/>    <!--    <base> 标签为页面上的所有链接规定默认地址或默认目标（target）：    href 规定链接的地址    target 规定打开新链接 是在新窗口还是怎么    -->    <link rel="stylesheet" type="text/css" href="mystyle.css" />    <!--    <link> 标签定义文档与外部资源之间的关系。    <link> 标签最常用于连接样式表：    -->    <style>    </style>    <!--    <style> 标签用于为 HTML 文档定义样式信息。    您可以在 style 元素内规定 HTML 元素在浏览器中呈现的样式：    -->    <script>        /*script 写JS的*/    </script></head><body></body></html>

具体效果如下：

代码解释如下：

主要是介绍了head标签内部的东西。

<!--<head> 元素是所有头部元素的容器。<head> 内的元素可包含脚本，指示浏览器在何处可以找到样式表，提供元信息，等等。以下标签都可以添加到 head 部分：<title>、<base>、<link>、<meta>、<script> 以及 <style>。-->

meta主要是HTML文档的一些信息。

 <meta charset="UTF-8">    <meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" />    <!--这一句的功能是 使得 页面5秒后 指向这个网址-->    <meta name="author" content="zs"><!--作者-->    <meta name="revised" content="zs，2016.7.31"><!--revised ，应该也是作者信息。英文意思是经过修正的-->    <meta name="generator" content="WebStorm"><!--编辑器，-->    <meta name="description" content="描述"/><!--关于文档的描述--><!--一些搜索引擎会利用 meta 元素的 name 和 content 属性来索引页面。-->    <meta name="keywords" content="学些H5"/><!--定义页面关键词-->    <!--    元数据（metadata）是关于数据的信息。    <meta> 标签提供关于 HTML 文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。    典型的情况是，meta 元素被用于规定页面的描述、关键词、文档的作者、最后修改时间以及其他元数据。    <meta> 标签始终位于 head 元素中。    元数据可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。    -->

在这里，完成了一个功能，就是打开网页5秒之后跳转到指定网页的功能。

主要是运用了meta标签

<meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" />    <!--这一句的功能是 使得 页面5秒后 指向这个网址-->

还有就是给页面设置一些信息和关键词

<meta name="description" content="描述"/><!--关于文档的描述--><!--一些搜索引擎会利用 meta 元素的 name 和 content 属性来索引页面。-->    <meta name="keywords" content="学些H5"/><!--定义页面关键词-->

这两个挺重要的

title标签可以设置网页标题。

<title>   这是标题哦~！</title><!--    <title> 标签定义文档的标题。    title 元素在所有 HTML/XHTML 文档中都是必需的。    title 元素能够：    定义浏览器工具栏中的标题    提供页面被添加到收藏夹时显示的标题    显示在搜索引擎结果中的页面标题    -->

base标签里的属性规定一些默认的东西是什么

<base href="https://www.baidu.com/?tn=95505140_hao_pg"/><base target="_blank"/><!--<base> 标签为页面上的所有链接规定默认地址或默认目标（target）：href 规定链接的地址target 规定打开新链接 是在新窗口还是怎么-->

link标签规定了 css文件

<link rel="stylesheet" type="text/css" href="mystyle.css" /><!--<link> 标签定义文档与外部资源之间的关系。<link> 标签最常用于连接样式表：-->

style标签跟CSS文件一样设置样式

<style></style><!--<style> 标签用于为 HTML 文档定义样式信息。您可以在 style 元素内规定 HTML 元素在浏览器中呈现的样式：-->

script标签写一些交互性响应的代码

<script>    /*script 写JS的*/</script>

0 0