HTML学习笔记之--HTML的头部信息设置
-
定义网页的标题
html> <head> <title>此处设置标题title> head> <body> body> html>
-
设置网页的基底网址
html> <head> <title>基地网址的设置title> <base href="https://www.google.com" target="_blank" /> head> <body> body> html>
-
元信息标签
元信息标签是头部信息的基本标签，是单标签。
meta元素提供的信息对于浏览用户是不可见的，一般用于定义页面信息的名称、关键字、作者等。在HTML页面中，一个meta标签内就是一个meta的内容，而在一个HTML头页面中可以有多个meta元素。
meta标签属性分两种：页面描述信息（name）和http标题信息（http-equiv）。
-
name属性
用于描述页面内容。正确地设置name属性，以便搜索引擎（baidu、Google等）的搜索机器人查找、分类，搜索引擎一般都会自动查找meta值来给网页分类。name的取值如下：
1）keywords，关键字。用于说明网页所包含的关键字等信息，从而提高被搜索引擎搜索到的概率。一般可设多个关键字，之间用英文半角的逗号隔开。关键字的内容要简洁精炼。
content属性的值为用户所设置的具体关键字。
2) description，描述，用于描述网页的主要内容、主题等，合理的设置也可提高被搜索引擎搜索到的概率。
content属性的值最多可以容纳1024个字符，但搜索引擎一般只显示大约前175个字符。
3) author，作者。用于设置网站作者的名称。
4) generator，生成器。用于设置网站编辑工具的名称。
网站制作软件在创建HTML文档时会自动添加generator的content值。
5) robots，机器人。用于限制页面搜索方式。搜索引擎的“搜索机器人”沿着网站上的链接（如http和src链接），不断地检索资料建立自己的数据库。通过这种meta标签可以限制部分内容不被搜索引擎检索到，从而降低部分信息公开性。
content属性的值包含4个命令，分别是：index、noindex、follow、nofollow。指令组合一共有4种：
| index，follow（也可写成 all） | 页面允许被检索，页面中的链接也允许被检索 |
| index，nofollow | 页面允许被检索，页面中的链接不允许被检索 |
| noindex，follow | 页面不允许被检索，页面中的链接允许被检索 |
| noindex，nofollow（也可写成 none） | 页面不允许被检索，页面中的链接也不允许被检索 |
只有部分搜索引擎支持robots meta标签。
name属性主要用于对搜索引擎的优化。
-
http-equiv属性
用于描述标题信息。取值如下：
1) content-type，内容类别。用于设置页面的类别和语言字符集。
content属性的值代表页面采用HTML代码输出，字符集为utf-8。
2) refresh，刷新。用于设置多长时间内网页自己刷新一次，或者过一段时间自动跳转到其他页面。
content属性的值代表页面自动刷新的时间间隔为5秒。
content属性的值代表5秒后页面自动跳转到www.google.com网站。
3) expires，到期。用于设置页面到期时间，一旦页面过期，必须到服务器上重新调用网页。
content属性的值表示网页过期的时间，必须使用GMT的时间格式。
content属性的值为数字时代表多长时间后过期。
4) cache-control，缓存控制。用于禁止在缓存中调用网页。
content属性值“no-cache”代表不缓存。
为了加快浏览速度，一般都会在浏览者的硬盘上保存一个网页的文件作为临时版本。用户再次打开同一个网页时，浏览器会直接调用硬盘上这个版本的网页而不是服务器上的版本。如果想让用户每次都看到最新版本，则需要使用这种meta标签近乎浏览器调用缓存中的版本。设定了禁止调用缓存后，用户一旦离开网页，就无法从缓存中再调用该页面了，而要到服务器请求该页面。
5) set-cookie，设置cookie。用于设置本页面cookie多久过期。
content属性的值代表到这个时间时，cookie将被删除，时间采用GMT时间格式。
cookie是服务器暂时存放在用户的电脑中的资料，以文本格式的文件保存，以便让服务器用来辨认用户的计算机。
当浏览网站时，Web服务器会先送一部分资料到浏览者的硬盘上，这就是cookie。当下次访问该网站时，Web服务器会先看看有没有上次留下的cookie资料，如果有，会根据cookie里的内容判断使用者。cookie广泛应用于网站的注册登录系统，同时，浏览者的cookie也常被网站运营者收集，便于分析浏览者的浏览习惯。
-
和 CSS 及 JavaScript 产生联系
CSS负责HTML网页的样式，JavaScript负责HTML网页的动态行为。
-
CSS的设置方法
-
html> <html lang="en"> <head> <meta charset="UTF-8"> <title>CSS的设置title> <style type="text/css"> CSS的具体内容 style> head> <body> body> html> -
JavaScript的设置方法
-
html> <html lang="en"> <head> <meta charset="UTF-8"> <title>CSS的设置title> <style type="text/css"> CSS的具体内容 style> <script type="text/javascript"> JavaScript的具体内容 script> head> <body> body> html> -
头部信息的其他设置
1) 页面切换特效
http-equiv属性的值为page-enter是代表进入该页面时启用特效，http-equiv属性的值为page-exit时代表离开该页面时启用该特效；
content属性的值代表特效的种类，这种特效也叫动态滤镜。blendtrans的效果为淡入淡出，duration的值代表效果持续的时间（单位为s）。
duration的值代表效果持续的时间（单位为s），transition是滤镜类型，表示使用哪种特效，取值为0~23
2)强制页面在当前窗口以独立页面显示，以防止网站被其他网站框架
3) 页面图标的设置
href属性的值是ico图标文件的路径，这里采用的是相对根目录路径。
应把用于网页图标的ico文件命名为favicon.ico，并放置于网站的根目录。
注：以上内容为本人笔记，内容取自《网页开发手记：HTML+CSS+JAVASCRIPT 实战详解》