• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > HTML5中meta属性的使用方法

HTML5中meta属性的使用方法

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含HTML5,meta属性等相关知识,佚名 希望在学习及工作中可以帮助到您

meta属性在HTML中占据了很重要的位置。如:针对搜索引擎的SEO,文档的字符编码,设置刷新缓存等。虽然一些网页可能没有使用meta,但是作为正规军,我们还是有必要了解一些meta的属性,并且能够熟练使用它们。

1、声明文档使用的字符编码

  1. <meta charset='utf-8'>  
  2.   

2、声明文档的兼容模式

  1. <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 指示IE以目前可用的最高模式显示内容   
  2. <meta http-equiv="X-UA-Compatible" content="IE=Emulate IE7" />指示IE使用 <!DOCTYPE> 指令确定如何呈现内容。标准模式指令以IE7 标准模式显示,而 Quirks 模式指令以 IE5 模式显示。   
  3.   

3、SEO 优化

  1. <meta name="description" content="不超过150个字符" />页面描述   
  2. <meta name="keywords" content="html5, css3, 关键字"/>页面关键词   
  3. <meta name="author" content="魔法小栈" />定义网页作者   
  4. <meta name="robots" content="index,follow" />定义网页搜索引擎索引方式,robotterms是一组使用英文逗号「,」分割的值,通常有如下几种取值:none,noindex,nofollow,all,index和follow。   
  5.   

4、为移动设备添加 viewport

  1. <meta name ="viewport" content ="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">  
  2.     content 参数解释:   
  3.     width       viewport 宽度(数值/device-width)   
  4.     height            viewport 高度(数值/device-height)   
  5.     initial-scale  初始缩放比例   
  6.     maximum-scale  最大缩放比例   
  7.     minimum-scale  最小缩放比例   
  8.     user-scalable  是否允许用户缩放(yes/no)   
  9.     minimal-ui      iOS 7.1 beta 2 中新增属性,可以在页面加载时最小化上下状态栏。这是一个布尔值,可以直接这样写:   
  10. <meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui">  
  11.   

5、iOS 设备

  1. <meta name="apple-mobile-web-app-title" content="标题">添加到主屏后的标题(iOS 6 新增)   
  2. <meta name="apple-mobile-web-app-capable" content="yes"

您可能想查找下面的文章:

  • HTML5知识点总结
  • HTML5的本地存储
  • HTML5本地存储之IndexedDB
  • Html5实现文件异步上传功能
  • Html5新标签datalist实现输入框与后台数据库数据的动态匹配
  • 详解HTML5 window.postMessage与跨域
  • HTML5拖放API实现拖放排序的实例代码
  • 解决html5中video标签无法播放mp4问题的办法
  • HTML5新特性 多线程(Worker SharedWorker)
  • Html5新增标签有哪些

相关文章

  • 2018-12-03详解HTML5新表单属性
  • 2018-12-03左右滑动条原理。?
  • 2018-12-03基于HTML5 Canvas 实现地铁站监控
  • 2018-12-03HTML5 postMessage 和 onmessage API 详细应用
  • 2018-12-03H5项目开发iOS插件功能的实例代码
  • 2018-12-03HTML5中对style属性的解释与规定
  • 2017-08-06利用纯html5绘制出来的一款非常漂亮的时钟
  • 2018-12-03HTML5 Web Storage的图文详解
  • 2018-12-03HTML5开发中使用MVC模式
  • 2018-12-03HTML5/CSS3实现漂亮的分步骤注册登录表单的示例代码分享

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • html5新增加的标签总结
    • HTML5是什么 HTML5是什么意思 HTML5简介_html5教程技巧
    • html5教程制作简单画板代码分享_html5教程技巧
    • HTML5学习笔记之History API
    • 李炎恢HTML5视频资料分享
    • HTML5实现经典坦克大战坦克乱走还能发出一个子弹_html5教程技巧
    • 如何适配不同分辨率和不同屏幕尺寸的手机
    • HTML5之SVG 2D入门7—SVG元素的重用与引用
    • H5学习之旅-H5的基本标签(2)
    • Vue组件的开发技巧总结

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有