HTML头部元素实例
HTML head 元素
| 标签 | 描述 |
|---|---|
| <head> | 定义了文档的信息 |
| <title> | 定义了文档的标题 |
| <base> | 定义了页面链接标签的默认链接地址 |
| <link> | 定义了一个文档和外部资源之间的关系 |
| <meta> | 定义了HTML文档中的元数据 |
| <script> | 定义了客户端的脚本文件 |
| <style> | 定义了HTML文档的样式文件 |
| <noscript> | 定义在脚本未被执行时的替代内容(文本) |
1、<title>文档标题</title>
2、<base href="http://www.meng.com/images/" target="_blank">
3、<link rel="stylesheet" type="text/css" href="mystyle.css">
4、<meta> 标签- 使用实例
4、<meta>标签实例:
为搜索引擎定义关键词:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
为网页定义描述内容:
<meta name="description" content="编程">
定义网页作者:
<meta name="author" content="meng">
每30秒中刷新当前页面:
<meta http-equiv="refresh" content="30">
注释:
http-equiv顾名思义,相当于http的文件头作用,它可以向浏览器传回一些有用的信息,以帮助正确和精确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值。
1、Expires(期限)
说明:可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输。
用法:
- <meta http-equiv="expires" content="Wed, 20 Jun 2007 22:33:00 GMT">
注意:必须使用GMT的时间格式。
2、Pragma(cache模式)
说明:是用于设定禁止浏览器从本地机的缓存中调阅页面内容,设定后一旦离开网页就无法从Cache中再调出
用法:
- <meta http-equiv="Pragma" content="no-cache">
注意:这样设定,访问者将无法脱机浏览。
3、Refresh(刷新)
说明:自动刷新并指向新页面。
用法:
- <meta http-equiv="Refresh" content="2;URL=http://www.net.cn/">
注意:其中的2是指停留2秒钟后自动刷新到URL网址。
4、Set-Cookie(cookie设定)
说明:如果网页过期,那么存盘的cookie将被删除。
用法:
- <meta http-equiv="Set-Cookie" content="cookievalue=xxx;expires=Wednesday, 20-Jun-2007 22:33:00 GMT; path=/">
注意:必须使用GMT的时间格式。
5、Window-target(显示窗口的设定)
说明:强制页面在当前窗口以独立页面显示。
用法:
- <meta http-equiv="Window-target" content="_top">
注意:用来防止别人在框架里调用自己的页面。
6、content-Type(显示字符集的设定)
说明:设定页面使用的字符集。
用法:
- <meta http-equiv="content-Type" content="text/html; charset=gb2312">
7、Pics-label(网页等级评定)
用法:
- <meta http-equiv="Pics-label" contect="">
说明:在IE的internet选项中有一项内容设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过meta属性来设置的。
8、Page_Enter、Page_Exit
设定进入页面时的特殊效果
- <meta http-equiv="Page-Enter" contect="revealTrans(duration=1.0,transtion= 12)">
设定离开页面时的特殊效果
- <meta http-equiv="Page-Exit" contect="revealTrans(duration=1.0,transtion= 12)">
Duration的值为网页动态过渡的时间,单位为秒。
Transition是过渡方式,它的值为0到23,分别对应24种过渡方式。如下表:
0 盒状收缩 1 盒状放射
2 圆形收缩 3 圆形放射
4 由下往上 5 由上往下
6 从左至右 7 从右至左
8 垂直百叶窗 9 水平百叶窗
10 水平格状百叶窗 11垂直格状百叶窗
12 随意溶解 13从左右两端向中间展开
14从中间向左右两端展开 15从上下两端向中间展开
16从中间向上下两端展开 17 从右上角向左下角展开
18 从右下角向左上角展开 19 从左上角向右下角展开
20 从左下角向右上角展开 21 水平线状展开
22 垂直线状展开 23 随机产生一种过渡方式
9、清除缓存(再访问这个网站要重新下载!)
- <meta http-equiv="cache-control" content="no-cache">
10、设定网页的到期时间
- <meta http-equiv="expires" content="0">
11、关键字,给搜索引擎用的
- <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
12.页面描述
- <meta http-equiv="description" content="This is my page">
HTML头部元素实例的更多相关文章
- HTML块元素,行内元素,类,头部元素
总结HTML块元素,行内元素,类,头部元素 块元素: 在HTML中,块级元素的高度为其内容的高度,宽度会扩展到与父容器同宽.默认情况下,块级元素会独占一行,并且元素前后行留空. 示例:<h1&g ...
- HTML 头部 (head) 实例
所有表签解释.HTML <meta> 元素元数据(metadata)是关于数据的信息. <meta> 标签提供关于 HTML 文档的元数据.元数据不会显示在页面上,但是对于机器 ...
- React 表单元素实例
代码实例: <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset=" ...
- Wpf 鼠标拖动元素实例
1.Wpf中鼠标捕获和释放 //以矩形为例 //创建鼠标捕获 Mouse.Capture(rectOne); //释放鼠标捕获 rectOne.ReleaseMouseCapture(); 2.Wpf ...
- 记录--jquery 获取父级、子级、兄弟元素 + 实例
需求如下: 三条数据,需点击其中一条数据在其下面展示与此数据关联的图片.主要功能可能是在点击的数据下增加显示行 思路: 把需要点击增加的数据先隐藏.点击后再将其显示出来. 知识点: jQuery.pa ...
- 第五章 动画 48:动画-使用transition-group元素实例列表动画
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 用Javascript动态添加删除HTML元素实例 (转载)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 关于w3school的html5部分output 元素实例代码(点亲自试一试进去)的问题纠正
修复: 将原来的 = 号修改成 <input type="button" onclick="resCalc()" value ="=" ...
- CSS Clip剪切元素实例
一.实例1: .fixed { position: fixed; width: 382px; height: 100px; background: red; border: 1px solid blu ...
随机推荐
- umask码和文件权限
umask是chmod配套的,总共为4位(gid/uid,属主,组权,其它用户的权限),不过通常用到的是后3个,例如你用chmod 755 file(此时这文件的权限是属主读(4)+写(2)+执行(1 ...
- HDU6298 Maximum Multiple (多校第一场1001)
Maximum Multiple Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) ...
- vue.js使用elemnetUi
安装: npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i element-ui -S 引入 Element 你可以引入整个 Element,或是 ...
- JDK的详细安装步骤
jdk的安装 一.下载jdk安装包,可以从https://www.cnblogs.com/zyx110/p/10799387.html中查找并下载 二.双击打开jdk安装包,一路傻瓜式安装,点击下一步 ...
- 前端优化系列之一:dns预获取 dns-prefetch 提升页面载入速度
问题:怎么做到dns域解析? 用于优化网站页面的图片 问题:怎么提升网站性能? dns域解析,是提升网站的一个办法. DNS Prefetch,即DNS预获取,是前端优化的一部分. 一般来 ...
- 解决dubbo注册zookepper服务IP乱入问题的三种方式
最近做一个项目引入了dubbo+zookepper的分布式服务治理框架.在应用的发布的时候出现一个怪问题.zookepper服务是起在开发服务器192.168.23.180上.本机起应用服务提供者注册 ...
- Linux(ubuntu)下固定IP的方法
写在前面,问:为什么要固定ip.答:要知道固定IP的好处多多,随意搬动,固定共享地址,不怕断网等等 首先,我们要选取一个局域网内的IP,方法如下: 1.选取IP号段,一般是路由器DCHP以外的IP地址 ...
- js 点击页面出现烟花 心形
css :1 body{width:1000px; height:500px;} input{ margin:100px; width:250px; height: 50px } 3 .Firewor ...
- 74th LeetCode Weekly Contest Preimage Size of Factorial Zeroes Function
Let f(x) be the number of zeroes at the end of x!. (Recall that x! = 1 * 2 * 3 * ... * x, and by con ...
- css雪碧图制作
使用css背景合并工具cssSprite 工具下载链接: http://download.csdn.net/download/wx247919365/8741243 1.选择文件 2.生成雪碧图 3. ...