HTML <head> 元素

<head> 元素是所有头部元素的容器。<head> 内的元素可包含脚本，指示浏览器在何处可以找到样式表，提供元信息，等等。

以下标签都可以添加到 head 部分：<title>、<base>、<link>、<meta>、<script> 以及 <style>。

HTML <title> 元素

<title> 标签定义文档的标题。

title 元素在所有 HTML/XHTML 文档中都是必需的。

title 元素能够：

  • 定义浏览器工具栏中的标题
  • 提供页面被添加到收藏夹时显示的标题
  • 显示在搜索引擎结果中的页面标题

一个简化的 HTML 文档：

<!DOCTYPE html>

<html>

<head>

<title>Title of the document</title>

</head>

<body>

The content of the document......

</body>

</html>

HTML <base> 元素

<base> 标签为页面上的所有链接规定默认地址或默认目标（target）：

<head>

<base href="http://www.w3school.com.cn/images/" />

<base target="_blank" />

</head>

HTML <link> 元素

<link> 标签定义文档与外部资源之间的关系。

<link> 标签最常用于连接样式表：

<head>

<link rel="stylesheet" type="text/css" href="mystyle.css" />

</head>

HTML <style>

<style> 标签用于为 HTML 文档定义样式信息。

您可以在 style 元素内规定 HTML 元素在浏览器中呈现的样式：

<head>

<style type="text/css">

body {background-color:yellow}

p {color:blue}

</style>

</head>

HTML <meta> 元素

元数据（metadata）是关于数据的信息。

<meta> 标签提供关于 HTML 文档的元数据。元数据不会显示在页面上，但是对于机器是可读的。

典型的情况是，meta 元素被用于规定页面的描述、关键词、文档的作者、最后修改时间以及其他元数据。

<meta> 标签始终位于 head 元素中。

元数据可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。

针对搜索引擎的关键词

一些搜索引擎会利用 meta 元素的 name 和 content 属性来索引您的页面。

下面的 meta 元素定义页面的描述：

<meta name="description" content="Free Web tutorials on HTML, CSS, XML" />

下面的 meta 元素定义页面的关键词：

<meta name="keywords" content="HTML, CSS, XML" />

name 和 content 属性的作用是描述页面的内容。

HTML <script> 元素

<script> 标签用于定义客户端脚本，比如 JavaScript。

我们会在稍后的章节讲解 script 元素。

HTML 头部元素

标签 描述
<head> 定义关于文档的信息。
<title> 定义文档标题。
<base> 定义页面上所有链接的默认地址或默认目标。
<link> 定义文档与外部资源之间的关系。
<meta> 定义关于 HTML 文档的元数据。
<script> 定义客户端脚本。
<style> 定义文档的样式信息。

HTML-头部的更多相关文章

  1. UEditor百度富文本编辑器--preview在线预览时头部被挡住的解决方案

    问题截图: 正常情况应该是如下显示: 解决方案: 1.打开ueditor/dialogs/preview/preview.html 2.找到body节点下面这一句 document.getElemen ...

  2. ZBrush中的头部模型该如何进行雕刻

    使用ZBrush®能够快速雕刻人物头部模型,教程只是大概介雕刻前的准备工作和一些软件基础,真正的雕刻还需要学习者具备一定的功底,本文向大家展示头部模型制作流程解析,初学者可以以它做参考拓展自己思路. ...

  3. 为不同分辨率单独做样式文件，在页面头部用js判断分辨率后动态加载定义好的样式文件

    为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件.样式文件命名格式如:forms[_屏幕宽度].css,样式文件中只需重新定义文本框和下拉框的宽度即可. 在包含的头文件 ...

  4. PHP header函数设置http报文头(设置头部域)

    PHP HTTP 简介: HTTP 函数允许您在其他输出被发送之前,对由 Web 服务器发送到浏览器的信息进行操作. PHP 5 HTTP 函数:header()     向客户端发送原始的 HTTP ...

  5. 【Android】NavigationView头部点击监听事件

    AndroidStudio给出的模板里面只有列表点击事件,即实现OnNavigationItemSelectedListener中的onNavigationItemSelected方法,根据item的 ...

  6. sublime自动生成头部注释

    1.在tool->new snippet-创建一个新的snippet sublime text2 用snippet 创建文件头部信息 Snippets are smart templates t ...

  7. 【转】http头部详解

    原地址:http://www.cnblogs.com/ziwuge/archive/2011/09/27/2193385.html HTTP 头部解释 1. Accept:告诉WEB服务器自己接受什么 ...

  8. 把token带到 http头部 或者验证一下referer

    提交地址:http://baozoumanhua.com/users/8311358提交数据:-----------------------------195704664324Content-Disp ...

  9. 固定Table的头部和左边的列-在Knockout Js使用场景下

    要求:固定Table的头部和左边的列 场景:Knockout Js被用于绑定Table的数据源. 固定HTML表格的头部和列是一个很常见的需求.此文:http://www.cnblogs.com/so ...

  10. js制作点击会自动隐藏的导航栏（固定在在头部的）

    想必大家应该见过这样的特效,本来头部是固定在网页的最上方的,点一下缩进去,再点一下 又可以缩回来,这种效果怎么实现的呢,我今天就做了一个.菜鸟勿喷. @charset "utf-8" ...

随机推荐

  1. 功能更新 | medini analyze — 符合ISO 26262的功能安全平台工具

            汽车电子电气系统的功能安全随着智能驾驶.新能源等新兴技术的发展而愈发受到重视.在国际功能安全标准ISO 26262的落地过程中遇到了很多的棘手问题:如何正确而有效地实施HARA以得到合 ...

  2. Java精通并发-通过openjdk源码分析ObjectMonitor底层实现

    在我们分析synchronized关键字底层信息时,其中谈到了Monitor对象,它是由C++来实现的,那,到底它长啥样呢?我们在编写同步代码时完全木有看到该对象的存在,所以这次打算真正来瞅一下它的真 ...

  3. docker学习6-docker-compose容器集群编排

    前言 实际工作中我们部署一个应用,一般不仅仅只有一个容器,可能会涉及到多个,比如用到数据库,中间件MQ,web前端和后端服务,等多个容器. 我们如果一个个去启动应用,当项目非常多时,就很难记住了,所有 ...

  4. Visual Studio Code 写Python代码

    之前用nodepad++,sublime text3,ultraedit,最近上手微软的vsc感觉上手还行,如果没有pycharm照样可以使用它 https://code.visualstudio.c ...

  5. 大数据之路week07--day07 （修改mysql默认编码）

    在Sqoop导入或者导出,我们在查看mysql的时候会出现中文乱码大部分乱码会是?这样的问号,那么该怎么处理呢? 1.打开my.cnf文件  vim /etc/my.cnf 2.找到对应需要修改的地方 ...

  6. 项目Alpha冲刺（团队) -- 测试

    项目Alpha冲刺(团队) --测试 1.团队信息 团队名 :男上加男 成员信息 : 队员学号 队员姓名 个人博客地址 备注 221600427 Alicesft https://www.cnblog ...

  7. Gym-100648B： Hie with the Pie（状态DP）

    题意:外卖员开始在0号节点,有N个人点了外卖,(N<=10),现在告诉两两间距离,问怎么配送,使得每个人的外卖都送外,然后回到0号点的总时间最短,注意,同一个点可以多次经过. 思路:TSP问题( ...

  8. pycharm激活2018(终极解决办法)

    1.将“0.0.0.0 account.jetbrains.com”中的内容添加到hosts文件中,hosts路径为:C:\Windows\System32\drivers\etc 2.打开http: ...

  9. 微信小程序——<scroll-view>滚动到最底部

    最近在做个直播间,有个这样的需要,就是进入到页面,<scroll-view>需要滚动到最底部,并且发送消息之后自动的滚动到底部. 开始想着计算里面内容的高度,然后通过设置 scroll-t ...

  10. HTML 009 select_jquery操作下拉框select

    取值问题 <select id="selector"> <option value="1">选项一</option> < ...