关闭

meta标签相关知识

标签: 移动
17人阅读 评论(0) 收藏 举报
分类:

1、移动端页面设置视口宽度等于设备宽度,并禁止缩放。

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />

2、移动端页面设置视口宽度等于定宽(如640px),并禁止缩放,常用于微信浏览器页面。

<meta name="viewport" content="width=640,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />

3、禁止将页面中的数字识别为电话号码

<meta name="format-detection" content="telephone=no" />

4、忽略Android平台中对邮箱地址的识别

<meta name="format-detection" content="email=no" />

5、当网站添加到主屏幕快速启动方式,可隐藏地址栏,仅针对ios的safari

<meta name="apple-mobile-web-app-capable" content="yes" />

<!-- ios7.0版本以后,safari上已看不到效果 -->

6、将网站添加到主屏幕快速启动方式,仅针对ios的safari顶端状态条的样式

<meta name="apple-mobile-web-app-status-bar-style" content="black" />

<!-- 可选default、black、black-translucent -->

viewport模板

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">

<meta content="yes" name="apple-mobile-web-app-capable">

<meta content="black" name="apple-mobile-web-app-status-bar-style">

<meta content="telephone=no" name="format-detection">

<meta content="email=no" name="format-detection">

<title>title</title>

<link rel="stylesheet" href="index.css">

</head>

 

<body>

    content...

</body>

 

</html>

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:173次
    • 积分:7
    • 等级:
    • 排名:千里之外
    • 原创:0篇
    • 转载:3篇
    • 译文:0篇
    • 评论:0条
    文章分类
    文章存档