Keywords(关键词)

说明:告诉搜索引擎你网页的关键字(keywords)
使用方法:<meta name="keywords" content="标签,属性,seo优化">

Robots (机器人向导)

说明:Robots用来告诉搜索机器人页面需要或者不需要索引。Content的參数有all、none、index、noindex、follow、nofollow。默认是all。

使用方法:<meta name="robots" content="All|None|Index|Noindex|Follow|Nofollow">

all:文件将被检索,且页面上的链接能够被查询。
none:文件将不被检索。且页面上的链接不能够被查询。(和 "noindex, no follow" 起同样作用)
index:文件将被检索;(让robot/spider登录)
follow:页面上的链接能够被查询;
noindex:文件将不被检索,但页面上的链接能够被查询;(不让robot/spider登录)
nofollow:文件将不被检索,页面上的链接能够被查询。(不让robot/spider顺着此页的连接往下探找)

viewport(视窗/移动端)

说明:viewport 是用户网页的可视区域,即“视区”。

使用方法:<meta name="viewport" content="width=device-width, initial-scale=1.0">

  • width:控制 viewport 的大小,可以指定的一个值,如 600,或者特殊的值,如 device-width 为设备的宽度(单位为缩放为 100% 时的 CSS 的像素)。
  • height:和 width 相对应,指定高度。
  • initial-scale:初始缩放比例,也即是当页面第一次 load 的时候缩放比例。
  • maximum-scale:允许用户缩放到的最大比例。
  • minimum-scale:允许用户缩放到的最小比例。
  • user-scalable:用户是否可以手动缩放。

http-equiv="X-UA-Compatible" (这是一个文档兼容模式的定义

使用: < meta http-equiv = "X-UA-Compatible" content = "chrome=1" >

X-UA-Compatible:是IE8新加的一个设置,对于IE8以下的浏览器是不识别的,通过在meta中设置X-UA-Compatible的值,可以指定网页的兼容性模式设置。

< meta http-equiv = "X-UA-Compatible" content = "chrome=1" >用以声明当前页面用chrome内核来渲染。

Edge模式告诉IE以最高级 模式渲染文档,也就是任何IE版本都以当前版本所支持的最高级标准模式渲染,避免版本升级造成的影响。

renderer  (指定双核浏览器默认以何种方式渲染页面

使用:<meta name="renderer" content="webkit">

这段代码意思:强制浏览器使用Webkit内核。

若页面需默认用极速核,增加标签:<meta name="renderer" content="webkit">
若页面需默认用ie兼容内核,增加标签:<meta name="renderer" content="ie-comp">
若页面需默认用ie标准内核,增加标签:<meta name="renderer" content="ie-stand">

举例说明
a. 设置屏幕宽度为设备宽度,禁止用户手动调整缩放
 <meta name="viewport" content="width=device-width,user-scalable=no" />

b. 设置屏幕密度为高频,中频,低频自己主动缩放,禁止用户手动调整缩放)
<meta name="viewport" content="width=device-width, target-densitydpi=high-dpi, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

另外iOS 7.1的Safari为meta标签新增minimal-ui属性,在网页载入时默认隐藏地址栏与导航栏。

meta标签常用属性的更多相关文章

  1. HTML中的meta标签常用属性及其作用总结

    文章同步到github 以前没怎么太注意过meta标签的作用,只是简单了解一些常用属性,现在结合个人了解的进行记录与总结: 元数据 首先需要了解一下元数据(metadata)元素的概念,用来构建HTM ...

  2. meta标签常用属性整理

    在segmentfault看到这篇文章,觉得整理的很详细,所以转载过来和大家分享一下. 原文地址:http://segmentfault.com/blog/ciaocc/119000000240791 ...

  3. video标签常用属性及说明

    video标签常用属性(在标签内部使用) video常用API属性及方法(API属性是供JS调用的,不在video标签元素中直接使用)

  4. 【Bean】标签常用属性

    [Bean]标签常用属性 Id 说明:起名称,id属性值名称任意,不能包含特殊符号,根据id得到配置对象. Class 说明:创建对象所在类的全路径. Name 说明:功能和id是一样的,id属性值不 ...

  5. 学习meta标签http-equiv属性

    meta标签http-equiv属性的使用:meta标签http-equiv属性的使用

  6. meta标签补充属性(viewport)

    我们在开发移动设备的网站时,最常见的的一个动作就是把下面这个东西复制到我们的head标签中: <meta name="viewport" content="widt ...

  7. H5 meta标签常用写法

    <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content=" ...

  8. HTML5 video 视频标签 常用属性

    最近在做手机端的 h5 页面的视频直播功能,用到了 Video 标签.其常用的属性有以下几个: src.poster.preload.autoplay.loop.controls.width.heig ...

  9. meta标签常用设置

    <!DOCTYPE html> <!-- 使用 HTML5 doctype,不区分大小写 --> <html lang="zh-cmn-Hans"&g ...

随机推荐

  1. Comparison method violates its general contract! 异常原因

    项目运行期间出现Comparison method violates its general contract!异常,网上查阅了一下,原因还是比较明确的: Collections.sort(list, ...

  2. Colly provides a clean interface to write any kind of crawler/scraper/spider

    Scraping Framework for Golang http://go-colly.org/ https://github.com/gocolly/colly package main imp ...

  3. Embed image in a <button> element 微信小程序 客服按钮

    html - Embed image in a <button> element - Stack Overflow https://stackoverflow.com/questions/ ...

  4. wireshark 学习 2

    使用wireshark抓到的wifi数据包如果是加密的,就只能显示密文,无法得到真正的数据. 如果知道AP和SSID和key,就可以解密wifi数据包,显示上层协议的数据. 在wireshark中设置 ...

  5. 自动化测试框架selenium+java+TestNG——TestNG详解

    TestNG按顺序执行case package com.testngDemo; import org.testng.annotations.AfterClass; import org.testng. ...

  6. PL/SQL DEVELOPER执行计划的查看

    这里,我学到的一个很重要的东西,就是用PL/SQL DEVELOPER去看一条SELECT语句的执行计划,执行计划里面可以看到这条SELECT语句的开销.I/O操作开销等数值,可以很清晰地看到语句各个 ...

  7. macbook清理磁盘空间

    前言:作为一名程序员,使用MacBook时间久了之后难免都会遇到“磁盘空间不足”的警告,这时就可以清理如下文件夹,一般就可以清理出几十个G的大小! 1.删除“~/资源库/Developer/Xcode ...

  8. android:Android中用文件初始化sqlite数据库

    很多时候在应用安装初始化时,需要创建本地数据库,同时为数据库添加数据,之后再从数据库中读取数据. 这里有2个思路 1.先在本地创建一个能支持android使用的sqlite数据库文件,启动时,用现成的 ...

  9. 【Spring MVC】 - @ModelAttribute使用

    @ModelAttribute一个具有如下三个作用: ①绑定请求参数到命令对象:放在功能处理方法的入参上时,用于将多个请求参数绑定到一个命令对象,从而简化绑 定流程,而且自动暴露为模型数据用于视图页面 ...

  10. tflearn 中文汉字识别,训练后模型存为pb给TensorFlow使用——模型层次太深,或者太复杂训练时候都不会收敛

    tflearn 中文汉字识别,训练后模型存为pb给TensorFlow使用. 数据目录在data,data下放了汉字识别图片: data$ ls0  1  10  11  12  13  14  15 ...