常用meta汇总

来源:互联网 发布:蓝色降落伞 知乎 编辑:程序博客网 时间:2024/06/08 12:21
1、<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />


viewport即可视区域,
对于桌面浏览器而言,viewport指页面除去所有工具栏、状态栏、滚动条等之后的区域。
为了兼顾在传统web页面和webapp上都有良好的显示效果,viewport还有以下几种属性值可以设置:
width: viewport 的宽度 (范围从 200 到 10,000 ,默认为 980 像素 )
height: viewport 的高度 (范围从 223 到 10,000 )
initial-scale: 初始的缩放比例 (<0<范围<=10 )
minimum-scale: 允许用户缩放到的最小比例
maximum-scale: 允许用户缩放到的最大比例
user-scalable: 用户是否可以手动缩放
我们在布局页面的时候可以根据自己的需要设置以上属性。
 
2、<meta name="keywords" contect="">
向搜索引擎说明你的网页的关键词。


3、<meta name="Description" contect="">
描述网站的的主要内容。


4、<meta name="Author" contect="你的姓名">
告诉搜索引擎你的站点的制作者。


5、<meta name="apple-touch-fullscreen" content="yes">
添加到主屏幕后,全屏显示。


6、<meta name="apple-mobile-web-app-capable" content="yes" />
是否显示工具栏和菜单栏,默认是显示,content有两个值”yes”和”no”。


7、<meta name=”apple-mobile-web-app-status-bar-style” content=black” />
content有三个值default(白色)、black(黑色)、black-translucent(灰色半透明),默认default。若值为“black-translucent”浮在页面上方,会覆盖页面20px高度,iphone4和itouch4的Retina屏幕为40px。


8、<meta name="apple-mobile-web-app-capable" content="yes">
如果content设置为yes,Web应用会以全屏模式运行,设置为no,表示正常显示。默认值为no。你可以通过只读属性window.navigator.standalone来确定网页是否以全屏模式显示。


9、<meta content="telephone=no" name="format-detection" />
忽略将页面中的数字识别为电话号码
10、<meta content="email=no" name="format-detection" />
将不识别邮箱
0 0
原创粉丝点击