跳转到内容

学科:IOS/KB/移动页面常用参考

添加链接
来自维基学院

viewpoint

[编辑 | 编辑源代码]

例： 

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">


CSS @media

[编辑 | 编辑源代码]

例： 

@media screen and (max-device-width: 480px) {}

例： 

<link rel="stylesheet" media="screen and (max-width: 320px)" href="portrait.css" />
<link rel="stylesheet" media="screen and (min-width: 321px)" href="landscape.css" />
<link rel="stylesheet" media="screen and (orientation:portrait)" href="portrait.css" />
<link rel="stylesheet" media="screen and (orientation:landscape)" href="landscape.css" />

CSS属性

[编辑 | 编辑源代码]

-webkit-text-size-adjust

[编辑 | 编辑源代码]
旋转屏幕时自动调整字体大小
可用值：none | auto（默认） | <percentage>

-webkit-user-select

[编辑 | 编辑源代码]
控制用户是否可以选择元素
可用值：auto | none | text

-webkit-touch-callout

[编辑 | 编辑源代码]
默认长按链接会弹出一选择菜单，可选择打开还是拷贝链接
可用值：default | none | inherit

-webkit-tap-highlight-color

[编辑 | 编辑源代码]
设置可点击元素的高亮颜色
可用值：<color>

响应触摸

[编辑 | 编辑源代码]

详见：Safari Web Content Guide > Handling Events

其他

[编辑 | 编辑源代码]

获取设备方向

[编辑 | 编辑源代码]

window.orientation

保存图标（apple-touch-icon）

[编辑 | 编辑源代码]

例： 

<link rel="apple-touch-icon" href="icon_url.png" />
<link rel="apple-touch-icon-precomposed" href="icon_url_has_highlight.png" />

页面保存为桌面图标后隐藏地址栏（apple-mobile-web-app-capable）

[编辑 | 编辑源代码]
<meta name="apple-mobile-web-app-capable" content="yes" />

FAQ

[编辑 | 编辑源代码]

iOS 6 POST 缓存

[编辑 | 编辑源代码]

iOS 6 上需设置 http header 的 Cache-Control 为 no-cache 才能阻止请求被缓存。

详见： http://stackoverflow.com/q/12506897

参考

[编辑 | 编辑源代码]
检索自“https://zh.wikiversity.org/w/index.php?title=Subject:IOS/KB/移动页面常用参考&oldid=154686”