配置项1.Viewport不设置的话,相当于用手机访问PC端页面一样,无初始缩放和页面宽度2.Apple设备使用WebApp模式(一般用于SPA应用,因为如果在里面点击还是跳转其他链接的话,还是会从Safari打开的)
在Safari浏览器点击分享按钮-添加到主屏幕,然后在桌面打开3.强制浏览器全屏(UC/QQ)
某些浏览器识别成功之后会将号码或者邮箱转换成a标签5.WindowsPhone点击无阴影
类似于css的-webkit-tap-highlight:transparent6.清除浏览器缓存
2.取消Input在Apple设备中,英文首字母默认大写
3.:active伪类失效
让Android或者Ios开发者提供一个App协议给你就可以了,让人尴尬的是,我们不知道用户到底有没有安装此App应用,所以需要Javascript来配合,当用户已安装直接跳转到App,没有安装跳到下载地址,详情在本文中的Javascript项5.软键盘弹出数字键盘(用户只能输入数字)
样式项1.去除某些区域点击的时候会出现阴影2.禁止用户长按选中、复制文本
3.禁止用户长按出现菜单栏
4.流畅滚动(一般用于overflow:scroll之后出现滚动不流畅的情况)
5.改变输入框placeholder的颜色值
6.修改表单元素的默认样式
checkbox也可以写成switch组件,点击查看switch组件7.多行文本超出显示省略号
8.css3启用硬件加速写transition、animation时,请用transform代替left、top等属性,从而使动画更流畅
9.解决transition闪屏
10.旋转屏幕时字体大小不改变
11.某些Android机圆角失效
12.select下拉选择设置右对齐
13.部分机型input的type为search时,自带close按钮的样式修改方案14.使用rem单位
1rem=1*根元素的font-size值,因此这里的bodyfont-size为14px,以后要修改font-size,直接修改根元素的就行啦,牵一发而动全身15.自定义滚动条样式
::-webkit-scrollbar修改浏览器滚动条样式,div::-webkit-scrollbar修改某个节点的滚动条样式16.Android上去掉语音输入按钮17.监听屏幕旋转事件并且处理样式
18.Flexbox兼容写法这里列出了几个经常使用的属性,一般情况下够用
这里列出了几个经常使用的属性,一般情况下够用19.高度Auto如何全屏居中html
css
fixed+flexbox布局,一般用于对话框20.左边固定宽度,右边自适应html
flex布局,以前用float+margin21.按钮点击的样式
22.Scroll-Xhtml
Javascript项1.唤醒App,唤醒失败则跳转到下载地址
2.浏览器滚动到底部,加载数据
offset为偏移量,距离底部还有多少时执行回调3.获取设备类型
isQQ返回是否是手机QQ内置浏览器,而不是QQ浏览器4.监听页面可见性变化
领取专属 10元无门槛券
私享最新 技术干货