-
2019-07-08 15:45:52
首先,这篇文章转自https://blog.csdn.net/qq_38881495/article/details/83513246,特声明一下版权,感谢!
1、在写手机端时必要需要加入meta
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
// (width=device-width),
// 初始缩放比例(initial-scale=1)为1.0,即网页初始大小占屏幕面积的100%。
// minimum-scale=1, maximum-scale=1 最大(最小)缩放比例
// user-scalable 是否允许用户缩放。2.删除默认的苹果工具栏和菜单栏
<meta name="apple-mobile-web-app-capable" content="yes">3.在web app应用下状态条(屏幕顶部条)的颜色
<meta name="apple-mobile-web-app-status-bar-style" content="black" />4.禁止了把数字转化为拨号链接
<meta name="format-detection" content="telephone=no">5.浏览网站时的小图标
<link rel="shortcut icon" href="snipaste_20170824_145806.png" type="image/x-icon" /> <!-- 修改小图标 -->
6.设置缓存
<meta http-equiv="Cache-Control"content="no-cache"/>
//手机页面通常在第一次加载后会进行缓存,然后每次刷新会使用缓存而不是去重新向服务器发送请求。如果不希望使用缓存可以设置no-cache。7.长时间按住页面出现闪退
element {-webkit-touch-callout:none;
}
8.select{
-webkit-appearance: none;
/*清除select默认样式*/
background: url("img/order_img/drop-down.png")no-repeat right;
/*注:上一步清除样式后,select中的三角符号也会被清除,所以需要自己添加下三角,我在此出用一个下三角背景图片填充*/
background-size: 0.3rem;
background-position-x: 96%;
}
9. format-detection 启动或禁用自动识别页面中的电话号码。
<meta name="format-detection"content="telephone=no">10、上下拉动滚动条时卡顿、慢
body {-webkit-overflow-scrolling: touch; overflow-scrolling: touch;}
11、禁止复制、选中文本
Element {-webkit-user-select:none;
-moz-user-select:none;
-khtml-user-select:none;
user-select:none;
}12、iphone及ipad下输入框默认内阴影
Element{
-webkit-appearance:none;
}13、ios和android下触摸元素时出现半透明灰色遮罩
Element {
-webkit-tap-highlight-color:rgba(255,255,255,0)
}14、圆角bug
某些Android手机圆角失效
background-clip: padding-box;
15、顶部状态栏背景色
<meta name="apple-mobile-web-app-status-bar-style"content="black"/>16、启动画面
<link rel="apple-touch-startup-image"href="start.png"/>
iOS下页面启动加载时显示的画面图片,避免加载时的白屏。17、windows phone 点击无高光
<meta name="msapplication-tap-highlight"content="no">18、ios 设置input 按钮样式会被默认样式覆盖
解决方式如下:
input,
textarea {
border: 0;
-webkit-appearance: none;
}设置默认样式为none
19、IOS键盘字母输入,默认首字母大写
解决方案,设置如下属性
<input type="text"autocapitalize="off"/>20、select 下拉选择设置右对齐
设置如下:
select option {
direction: rtl;
}21、消除 IE10 里面的那个叉号
input:-ms-clear{display:none;}22、处理点击延迟300s
$("#haorooms").on("touchend",function(event) {
event.preventDefault();
});23、ios滑动手机卡顿
body{ -webkit-overflow-scrolling:touch; overflow-scrolling:touch;} //上下拉动滚动条时卡顿、慢
-webkit-overflow-scrolling:touch;/*流畅滚动,ios7下会有滑一下滑不动的情况,所以需要写上*/
html,body{ -webkit-tap-highlight-color: rgba(0,0,0,0); } // 去掉苹果手机点击瞬间出现的灰色背景
input{ -webkit-appearance: none; } // 去除苹果手机默认的input样式
selector{ cursor: pointer } // 给IOS系统里cursor不为pointer的元素添加事件时会不同程度受影响,加上cursor: pointer可解决
img{ pointer-events: none; } // 阻止图片在微信里被点击放大24、viewport模板
<meta charset="utf-8">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">//主要I是强制让文档的宽度与设备宽度保持1:1,最大宽度1.0,禁止屏幕缩放。
<meta content="yes" name="apple-mobile-web-app-capable">//这个也是iphone私有标签,允许全屏浏览。
<meta content="black" name="apple-mobile-web-app-status-bar-style">//iphone的私有标签,iphone顶端状态条的样式。
<meta content="telephone=no" name="format-detection">//禁止数字自动识别为电话号码,这个比较有用,因为一串数字在iphone上会显示成蓝色,样式加成别的颜色也是不生效的。
<meta content="email=no" name="format-detection">
---------------------
作者:&星期八&
来源:CSDN
原文:https://blog.csdn.net/qq_38881495/article/details/83513246
版权声明:本文为博主原创文章,转载请附上博文链接!更多相关内容 -
HTML5手机登录密码设置页面模板
2021-05-01 07:30:09HTML5手机登录密码设置页面模板基于jquery.1.10.2.min.js制作,点击输入密码。 -
html5手机密码设置页面模板
2019-10-29 21:54:34html5手机密码设置页面模板 -
如何在手机上修改一下网页内容啊?
2019-01-16 22:27:25javascript:document.body.contentEditable='true'; document.designMode='on'; void 0 这个代码是什么意思,有什么用? -
怎么调整页面布局 “苹果手机”页面布局怎么调整?
2021-06-11 02:42:30在WORD中页面设置只想设置其中的一页,应该怎么做?在PPT2016中页面布局叫做幻灯片大小设置。...二是图纸里面的内容在图纸中的大校 一、选择页面,右键,选择页面布局,选择图纸尺寸,如A“苹果手机”页面布局怎么...在WORD中页面设置只想设置其中的一页,应该怎么做?
在PPT2016中页面布局叫做幻灯片大小设置。
电脑打开PPT2016,点击进入设计页面。
进入PPT幻灯片设计页面后,在右上角就可以看到幻灯片大校
点击下拉选择自定义幻灯片大校
你说的可以从两个方面来理解,一是改变页面大小,就是图纸尺寸的大小;二是图纸里面的内容在图纸中的大校 一、选择页面,右键,选择页面布局,选择图纸尺寸,如A
“苹果手机”页面布局怎么调整?
长按任意图标震动后可调整页面布局 具体步骤 一.打开屏幕。如下图: 二.长按任意图标震动后可编辑、如下图: 三.将相应APP移动到所想移到的位置就完成了。如下图: ; 注意事项:建议在分类的时候尽量把同一类型的APP放在一起放在查找。
Word的版面要CSS布局HTML小编今天和大家分享怎么设置?
先打开word,然后新建一个文档。
然后点击页边距,有一些比较常用的页边距。
首先在电脑上用Wps打开要编辑的文档,接着鼠标定位到横向排版页面的最前端,然后再点击Wps文字上面的“插入”菜单项;
在打开的插入菜单工具栏上,点击“分页”按钮,然后在弹出的下拉菜单中点击“下一页分节符”菜单项;
WPS如何调整.整页.页序,是包括页面布局格式的整页...现有一WPS文档(.doc)几十页,每一页都是独立的(即每页都有不同的页面先把word的内容修改好,转成PDF。在pdf里拖动重编每页的顺序。如果有页码会被打乱,也可以删掉页码,在排好序的pdf里插入页码。
Excel怎么 页面设置成横向,在一张纸上
Excel在一张纸上将页面设置成横向,在“页面布局”-“纸张方向”中设置为横向即可。 具体操作步骤如下:
打开需要相关的EXCEL表格,在上方工具栏中点击“页面布局”选项卡,然后找到并点击“纸张方向”。
在纸张方向弹出的选项中点击选择“横向”即
Excel 2003如何使用“页面布局”视图中设置页边距?
使用“页面布局”视图中设置页边距的方法如下:
点击下图红框中的“页面布局”选项。
接着点击下图红色箭头所指的“页面设置”按钮。
然后点击下图红框中的“页边距”面板按钮。
如下图所示,可以在两个红框中改变数值大小来调整页面的“左右
-
charles 抓包修改app页面数据
2020-12-09 23:53:141,首先给手机安装Charles证书,安装官方的来,在无线网配置项目,输入手动代理地址,后开启飞行模式刷新网络, 2,在浏览器输入chls.pro/ssl 下载并安装证书,此时电脑端charles 会弹出提示,选择信任...1,首先给手机安装Charles证书,安装官方的来,在无线网配置项目,输入手动代理地址,后开启飞行模式刷新网络,
2,在浏览器输入chls.pro/ssl 下载并安装证书,此时电脑端charles 会弹出提示,选择信任设备即可,安装成功后,开始操作,此刻Charles自动抓包,可查看接口内容
3,模拟实战,将雪球app中 股票名称修改为超长字符,验证 app的样式容错问题
打开Charles的工具栏,选择重写
选择添加 ,位置选择空,意思是全部位置
类型选择正文,响应,输入页面已经存在的文字,和替换文字,点击应用
页面数据被成功修改,验证样式无异常
验证股票涨时,样式是否为红色 且 无异常
-
华为手机怎么进行桌面管理?正确管理华为手机桌面图标及屏幕的方法
2020-12-20 06:32:40应该怎样管理华为手机的桌面?正确管理华为手机桌面图标及屏幕的方法分享给大家,主要帮助大家解决将图标移动到另一个桌面、管理桌面图标、如何管理屏幕及如何使桌面图标在重启后不变乱四个问题,好了话不多说,下面...应该怎样管理华为手机的桌面?正确管理华为手机桌面图标及屏幕的方法分享给大家,主要帮助大家解决将图标移动到另一个桌面、管理桌面图标、如何管理屏幕及如何使桌面图标在重启后不变乱四个问题,好了话不多说,下面要开始我的表演了!
将图标移动到另一个桌面
1、错误:长按图标,拖动图标移来移去。
注:图片中方框表示手指,箭头表示方向。
2、正确:一手指长按图标,另一只手指在空余处拖动。
管理桌面图标
1、错误:在普通模式下用手一个个将桌面图标移动到指定位置。麻烦不说,震动也很烦人。
2、正确:进入桌面管理模式管理图标。
方法一:手指长按桌面空白处。
方法二:双指向内滑动。
3、桌面管理模式如图。
如何管理屏幕
1、错误:在桌面管理模式下移动屏幕。
2、正确:进入屏幕管理模式。
方法:三指内滑。
3、屏幕管理模式如图。
ps:哪个小房子亮,则哪个屏幕是主屏。按HOME键时会强制跳回主屏。主屏一般放置重要软件。
如何使桌面图标在重启后不变乱
1、首先,输入你的机主密码,进入机主模式。如果不知道什么是机主密码,就把在手机上设置的密码全输一遍。看看哪一个跟你平时常用的密码不一样,但是仍能进入桌面。
2、打开设置。进入“安全”。
3、打开隐私保护。
注:此项只有在机主模式下才会出现。
4、输入机主密码,进入。可发现手机分为访客模式和机主模式两种。在访客模式下改变的桌面图标位置系统是不承认的,故重启之后图标按机主模式排列。所以请在机主模式下管理桌面图标。
5、若经过以上步骤,访客桌面重启之后还是会乱。请在机主模式下打开设置-应用管理-华为桌面,清除数据,回到桌面,管理桌面图标。回到访客模式后再重启,桌面图标就不会乱了。安装卸载软件,管理桌面图片请在机主模式下进行。
文章结束,以上就是关于华为手机怎么进行桌面管理?正确管理华为手机桌面图标及屏幕的方法的全部内容,希望大家看完有所收获!更多手机资讯,尽在脚本之家网站哦!
-
在Vue中如何实现动态修改页面title
2020-12-19 10:34:49这篇文章主要介绍了基于Vue的SPA动态修改页面title的方法,需要的朋友可以参考下最近基于VUE做个SPA手机端web发现动态修改页面标题通过document.title=xxxx来修改着实蛋疼,而且在IOS的微信端据说没效果。百度发现要... -
html页面在手机中点击输入框调出键盘页面内容上移的粗暴解决办法
2017-02-10 13:49:45在混合开发中遇到的问题,就是h5页面...所以,讲页面的高度写成固定高度便可以简单粗暴解决这个问题,当然, 需要修改的只是当焦点落在输入框的时候的模态框的高度,所以要通过js来实现; 下面是对应的js代码 -
部分安卓手机h5页面出现空白页面
2019-09-25 11:05:15经问题排查页面空白的手机主要是vivo和oppo手机且andriod系统版本较低. 测试机显示空白的版本是andriod 5.1.1 版本.本项目是在jsp页面中引入的vue 二 问题排查 在浏览器中显示正常. 不会出现空白. 通过抓包工具... -
192.168.1.101登陆页面手机进入 即可登陆
2020-12-30 21:51:38导语:聊到页面,大家应该都知道,有人问192.168.1.1,当然了,还有人想问192.168.0.1,这到底是咋回事?其实192.168.2.1手机登录呢,小编为大家带来192.168.1.101登陆页面手机进入,希望能够帮到您。192.168.1.101... -
手机端页面设置缓存
2018-08-07 08:15:19设置缓存 <...Cache-Control"content="no-cache"...手机页面通常在第一次加载后会进行缓存,然后每次刷新会使用缓存而不是去重新向服务器发送请求。如果不希望使用缓存可以设置no-cache。... -
帝国cms手机端静态页面同步生成修改文件方法
2018-08-25 15:41:21本文需配合“移动端同步生成”插件使用,需要修改的文件为e/class/functions....GetHtml——生成内容页函数; NewsBq——生成首页、封面页函数; NotinfoListHtml——列表页生成辅助函数。 一、ListHtml函数修改 ... -
超级好看的登录页面,可以密码和手机验证码页面(附源码)
2019-09-09 14:52:022.背景刷新一次换一次,也可以隔几分钟换一次js代码中可以修改 3.模仿可道云的布局 界面 项目地址 https://github.com/lg10/Login-for-cap.git 想法 在过程中发现还有很多需要优化的地方,大... -
【非常重要】discuz修改默认首页【自定义手机跳转页面】设置为门户页portal.php(解决设置后手机端portal...
2019-09-17 12:55:38参考文章:... 注意:访问手机端发现进入门户页(portal.php)后自动跳转至论坛(forum.php)时,请打开 source/class/discuz/discuz_application.php 文件,在792行添加如下代码 "&&CURSCRI... -
华为手机怎么返回主界面
2020-12-29 10:58:44通常没有个性化设置的情况下,打开手机后,在主界面上,就会有设置选项,图标是一个齿轮,下面有“设置”二字,如图所示:第二步 选择全部设置,打开后上方有全部设置和常用设置,点右侧全部设置,选中的标志是,... -
在手机上调试H5页面
2019-07-05 16:48:49在电脑和手机上都安装Chrome浏览器; 手机用数据线连接到电脑上; 在设置的开发者选项里开启手机的USB调试; 要确保手机和电脑连接的是同一局域网,并且关掉电脑上的防火墙; 电脑上的chrome浏览器访问chrome://... -
通过webview修改网页内容
2020-05-09 16:20:38有个需求,通过webview在打开第三方H5页面的时候,把卡号设置到第三方页面的卡号输入框。代码完整如下: package com.example.study2020; import androidx.appcompat.app.AppCompatActivity; import android.os.... -
【unity webgl制作手机h5小游戏】——加载页面修改(完结)
2020-05-21 16:22:56大家都知道在unity中用webgl发布后它有一个加载界面是unity的,这个很简单的页面,那我想修改成一个自己的页面怎么办呢? 我查了很多的方法不过好像是专业版能修改好像,我也不太清楚,然后对js代码不太懂的我就... -
手机端H5页面时间插件
2018-09-11 10:53:10插件最终版图: 1.... ...<script src="../mobile/js/mobiscroll_date.js"></script> <script src="../mobile/js/mobiscroll.js"></script> ...皮肤其他参数【android-ics light】【android-ics...样式可自行修改,百度 -
手机web前端调试页面的几种方式
2019-07-18 00:20:56PC端web页面调试比较容易,这里主要说几种移动端调试的方法,从简单到复杂、从模拟调试到远程调试,大概分为几部分: 1、Chrome DevTools(谷歌浏览器)的模拟手机调试 2、weinre(web inspectorremote)远程调试... -
vue移动端h5修改页面title
2020-05-29 15:49:12vueCli3移动端h5修改页面title -
vue页面内容生成图片并保存本地方案
2019-03-29 13:55:14既然你打开了这篇博客,那么你肯定碰到了和页面截图多少相关的问题,你在浏览器内生成图片也好,微信内生成页面图片也好,都需要面对把页面内容转成图片的问题。 1.将整个页面转成图片; 2.将页面内部分内容转成图片... -
在mac上如何用safari调试ios手机的移动端页面
2019-12-06 11:33:09第一步:打开iphone手机的开发者模式,流程是:【设置】->【Safari】->【高级】->开启【Web检查器】 ,如图1、图2 图2 第二步:打开Mac上Safari的开发者模式,流程是【Safari】->【偏好设置】->... -
Bootstrap的使用方法,自适应手机页面
2020-05-18 09:15:33"viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 布局容器 Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意,... -
小米手机动态修改imei信息
2020-12-18 20:23:35前面文章介绍了如何在安卓手机上安装激活xposed框架,xposed框架的牛逼之处功能大家都清楚,能够不修改apk的前提下,修改系统内核的参数,打比方在某些应用领域,大家需要修改手机的某个系统参数,这情况下就需要... -
全套移动端_app_页面(商城)html_demo_前端页面
2018-09-04 15:20:12首页、会员中心页面、列表页、内容页、活动页等等一应俱全。很方便前端二次修改,或者jsp、PHP,ASP等程序员的使用,页面风格通用性强,符合大众审美,本套页面,已经测试,可以正常使用!欢迎交流。 -
自己第一次做手机web页面的一些总结
2017-05-22 17:50:55开发的第一个手机web应用的一些经验 -
页面变化通知-crx插件
2021-03-15 18:46:09页面自定义区域变化通知,当页面内容发生变化,将以手机短信,邮件或通过我们的手机客户端推送的形式通知您, 手机客户端安装地址: http://citsm.sinaapp.com/client.php 使用方法: 点击图标,移动鼠标到您页面中感... -
如何将苹果11手机中的内容和隐私访问限制功能关闭
2021-07-31 00:24:31如何将苹果11手机中的内容和隐私访问限制功能关闭腾讯视频/爱奇艺/优酷/外卖 充值4折起如何将苹果11手机中的内容和隐私访问限制功能关闭呢?一起看看具体操作步骤吧。1. 解锁手机后,找到设置图标,打开。2. 选择...