移动端常见问题解决方案

一、特殊样式

css3盒子模型

[crayon-5f95d93b24ffc657753213/]

清除点击高亮,设置transparent 完成透明

取消ios里Button、Input上的默认样式

禁用长按页面时的弹出菜单

通常当你在手机上长按图像 img ,会弹出选项 存储图像 或者 拷贝图像,若不想让用户这么操作,可以设置方法来禁止:

h5页面input tyPE=’num’时去掉右边的上下箭头

二、功能代码片段

禁止文本缩放

移动设备横竖屏切换时,文本的大小会重新计算,进行相应的缩放,当我们不需要这种情况时,可以选择禁止:

禁止选中内容

如果你不想用户可以选中页面中的内容,那么你可以禁掉

body初始化样式

动态获取html根字体大小

样式初始化css
normalize.css – 官网下载
normalize.css – github

三、meta标签设置

适应移动端

不对网站进行缓存

多核浏览器,优先使用最新版本的IE 和 Chrome++ 内核

添加到主屏幕时隐藏地址栏和状态栏(即全屏)

当我们将一个网页添加到主屏幕时,会更希望它能有像 App 一样的表现,没有地址栏和状态栏全屏显示,代码如下:

该方案在 iOS 和 Android5.0+ 上都通用。

添加到主屏幕时设置系统顶栏颜色

当我们将一个网页添加到主屏幕时,还可以对系统显示手机信号时间电池的顶部状态栏 颜色进行设置,前提是开启了:

有了这个前提,你可以通过下面的方式来进行定义:

content只有3个固定值可选:default | black | black-translucent

  • 如果设置为 default,状态栏将为正常的,即白色,网页从状态栏以下开始显示;
  • 如果设置为 black,状态栏将为黑色,网页从状态栏以下开始显示;
  • 如果设置为 black-translucent,状态栏将为灰色半透明,网页将充满整个屏幕,状态栏会盖在网页之上;
    该设置只在 iOS 上有效。
遮罩层滚动问题

在有遮罩层的情况下,遮罩层下方的内容依然可以透过遮罩层滚动,因此要取消这种操作

未经允许不得转载:一点博客-青梅煮码-共享博客 » 移动端常见问题解决方案
分享到:
赞(0) 打赏

评论抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏