什么是mata标签
<meta> 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。
<meta> 标签位于文档的头部,不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。
meta是html语言head区的一个辅助性标签。几乎所有的网页里,我们都能看到meta标签,不过浏览器的显示页面中是看不到的,也许你认为这些代码可有可无。其实meta标签很重要,会给你的网站带来实际的效果,例如网站描述()会在搜索引擎的索引中得到体现. 例如使用meta标签设置网站的编码是gbk2312还是utf-8meta标签设定关键字
基本语法
XML/HTML Code复制内容到剪贴板
<meta name="keywords" content="关键字1,关键字2,关键字3....">
关键字标签作用是告诉搜索引擎网站的内容的是关于那些方面的内容,方便搜索引擎对网站的定义和索引.关键字和关键字之间使用英文输入法下的逗号隔开,关键字的长度一般不超过100个字符.
例如我们网站是关于Web开发技术学习的网站,关键字描述可以这么写:
XML/HTML Code复制内容到剪贴板
<meta name="keywords" content="html教程,css教程,javascript教程">
当用户在搜索引擎搜索这些关键字时,你的网站就能在结果中出现. 但是由于早期很多作弊者(黑帽SEO)利于关键字堆砌作弊,现在的搜索引擎(百度)对关键字不再那么敏感.
meta标签设定描述
语法格式:
XML/HTML Code复制内容到剪贴板
<meta name=“discription” content=“描述的内容”>
网页的描述很重要,直接能够在搜索引擎中得到体现.例如打开百度网站搜索"新浪"看到以下页面
meta标签设定字符集
语法格式:
XML/HTML Code复制内容到剪贴板
<meta http-equiv =“content-type” content=“text/html; charset="编码格式”>
常见的编码格式有中文编码(gbk2312)和国际编码(UTF-8) ,gbk2312是中文编码,如果你的网站内容都是中文的就使用gbk2312 UTF-8是国际编码左右的文字通用(包括中文和英文). 它们的主要区别是gbk2312是专门为中文打造的,一个汉字占2个字符. UTF-8是通用的一个汉字占3个字节. 早期的网络带宽资源短缺所以使用gbk2312编码可以节省带宽,提高网页的打开速度,但是现在我们家庭带宽都是4M起完全忽略节省的那些字节.
示例:
XML/HTML Code复制内容到剪贴板
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
我们在浏览网页的时候,大多数人都碰到过乱码的页面把. 编码格式是让浏览器以设定的编辑格式进行解析,如果编码格式不正确就会用出现乱码. 所以我建议使用通用的UTF-8编码,这样全球所有的浏览器访问我们的网页都能正常显示.
meta标签设定自动刷新时间
语法格式
XML/HTML Code复制内容到剪贴板
<meta http-equiv=“refresh” content=“刷新间隔的时间”>
刷新时间以秒为单位,例如论坛的页面只有刷新后才能看到新发布帖子,像这样更新速度很快的页面可以加入自动刷新的代码,保证可以看到最新的页面.
示例:
XML/HTML Code复制内容到剪贴板
<meta http-equiv=“refresh” content=“3”>
这里我们演示把时间设定为3秒,请自行测试.
meta标签设定自动跳转新页面
语法格式
XML/HTML Code复制内容到剪贴板
<meta http-equiv=“refresh” content=“跳转间隔的秒数; Url="新网页地址”>
示例:2881064178
XML/HTML Code复制内容到剪贴板
<meta http-equiv=“refresh” content=“3; Url="http://www.adminwang.com”>
当浏览器打开此页面,3秒后将自动跳转到我们网站的首页.
meta标签设定禁用缓存
语法格式
XML/HTML Code复制内容到剪贴板
<meta http-equiv="cache-control" content="no-cache" />
我们知道浏览器都有个缓存机制,就是打开一个网页会自动保存在本地,这样做的目的在一定的时间内再次访问会直接调用缓存中的文件提高访问速度. 但是像论坛这种时时变化的页面我们不希望浏览器保存缓存文件可以加上这句代码. 在程序开发中还有一个用途,程序调试要时时查看代码修改后的效果可以使用此代码禁用浏览器缓存.
另外的一种写法:
XML/HTML Code复制内容到剪贴板
<meta http-equiv="pragma" content="no-cache" >
WEB前端学习交流群21 598399936
什么是mata标签的更多相关文章
- Mata标签,og标签
一.Mata标签 meta是用来在HTML文档中模拟HTTP协议的响应头报文,meta 标签用于网页的<head>与</head>中.meta 的属性有两种:name和http ...
- HTML Meta标签
Meta标签用于存储web页面上的信息.本质上讲,它是信息数据.他帮助浏览器和搜索引擎更好地知道.理解页面内容. Web开发者,通过Mata标签设置页面描述.作者或关键字等等.然而,许多meta标签功 ...
- HTML5屏幕适配标签设置
开发HTML5游戏中,我们常用的一些mata标签: <meta name="viewport" content="width=device-width, initi ...
- 关于viewport
最近无聊的很,买了本教材,学习响应式网站设计. 因为有多年css的编程基础,前面的媒介查询学的很顺利.当学到viewport这个mata标签的时候,教程讲的比较简单. 今天,百度了不少资料,基本搞清楚 ...
- Web知识总结
一)window.location.href和window.location.replace的区别 1.window.location.href=“url”:改变url地址: 2.window.loc ...
- html常用笔记
<?php //CSS可以对文本格式进行精确的控制 //HTML标记更有利于搜索引擎 //一.标签 <br> <p>//换行后插入一个空行,单字节不换行,双字节自动换行 ...
- 学习H5一周随笔
H5学习也已经进行了一个周了,除了学习过程中的乱哄哄的脑子,对H5初学者(我)常见的问题有了如下见解. 1.初学者在建立新的Html文件之后,有时候会把 <meta charset=" ...
- css知识总结
---# 学习目标:> 1. 学会使用CSS选择器> 2. 熟记CSS样式和外观属性> 3. 熟练掌握CSS各种选择器> 4. 熟练掌握CSS各种选择器> 5. 熟练掌握 ...
- HTML+CSS项目——模拟京东网页
项目准备 项目名称:京东商城 项目描述:京东首页公共部分的头部和尾部制作,京东首页中间部分. 设计目标 保证浏览器 ie7及以上, 火狐, 360, safari,chrome等.谁让我再测ie6,就 ...
随机推荐
- 初试ubuntu14.4问题集锦2
好的,我开始继续鼓捣. 想了这么长时间,我想到的是,肯定是compiz设置了unity的什么东西才导致这种问题,绝非什么显卡驱动的事情. 于是二话不说,开机登录,进入tty1,然后apt-get re ...
- 页面加载完成,但ie进度条一直加载
页面ajax执行完删除等操作,会刷新当前页面,如果前端框架是左右iframe格式 我的前端页面提示用asyncBox,可能iframe和asyncBox的影响,出现这种情况: 网上大多数的说法是 页面 ...
- <input>标签
一. 上传图片: type="file":上传文件 accept:选择上传的种类,图片或者是视频(/png只能上传png格式的图片) multiple="multip ...
- bootstrap学习--什么是bootstrap
2011年,twitter的“一小撮”工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用.优雅.灵活.可扩展的前端工具集--BootStrap.Bootstrap由MARK ...
- MySql数据库4【命令行赋权操作】
MySQL 赋予用户权限命令的简单格式可概括为:grant 权限 on 数据库对象 to 用户 一.grant 普通数据用户,查询.插入.更新.删除 数据库中所有表数据的权利. grant selec ...
- vim操作命令-笔记
显示行号:在vim命令行模式下输入 :set nu 或 :set number 取消显示行号:在vim命令行模式下输入 :set nonu 或 :set nonumber 查看文件编码格式: :set ...
- EasyUI篇のico
所有图标位置: /themes/icons css引用位置: /themes/icon.css 可自行添加16*16的小图片放在icons中,icon.css代码添加即可 例如: .icon-logo ...
- iOS: 获取文件路径
iOS: 获取文件路径 // 例如 - (NSString *)applicationDocumentsDirectory { return [NSSearchPathForDirectories ...
- 转:PHP如何阻止用户上传成人照片或者裸照
原文来自于:http://www.hackbase.com/tech/2014-10-12/69367.html 当前,网络淫秽色情信息屡禁不止.屡打不绝,严重危害未成年人身心健康,严重败坏社会风气, ...
- 转:PHP的线程安全ZTS与非线程(NTS)安全版本的区别
原文来自于:http://blog.sina.com.cn/s/blog_94c21e8f0101s2ic.html Windows版的PHP从版本5.2.1开始有Thread Safe(线程安全)和 ...