h5 常见面试问题

1.ios按钮点击 有黑色阴影

-webkit-tap-hightlight-color:rgba(0,0,0,0);//无色 

2.输入框可以改变提示文字吗

.input::-webkit-input-placeholer {
		color:'#xxxxxx'
	}

3.关闭iOS首字母大小

<input autocapitalize='off'>

4.ios 禁用长按选择图片_h5移动端禁止长按图片保存
方法1

img {
	pointer-events:none;
}

**方法2（全局设置）**

*{
		user-select：none;//css3新增的属性，用于设置用户是否能够选中文本。
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		-webkit-touch-callout:none; //禁止长按菜单 针对webkit内核的浏览器。 解决长时间按住页面闪退的现象？
	}

5.rem与em区别
rem是更元素大小
首先：rem全称（font size of the root element）（根元素的字体大小）
它是css3新增的尺寸（度量单位），根节点（html）的font-size决定了rem的尺寸单位，也就是所它是一个相对的单位。
rem是一个相对长度单位。相对于父元素的倍数来计算。
浏览器默认字体大小是16px,1rem就是16px.
应用场景
可以用来做web app屏幕适配，因为不同手机型号的屏幕大小不同，所以这时候我们就不能用px(固定单位)
，rem是不同手机屏幕适配的一种方案。
em
首先 em是相对于父元素的字体大小来变化的
跟rem相比em有局限性，因为em只能相对父级文字大小变化，而rem是相对于根元素大小变化的。
vw、vh
vw（Viewport Width）、vh(Viewport Height)是基于视图窗口的单位，是css3的一部分，基于视图窗口的单位，
除了vw、vh还有vmin、vmax。
vw:1vw 等于视口宽度的1%
Vh:1vh 等于视口高度的1%
vmin: 选取 vw 和 vh 中最小的那个,即在手机竖屏时，1vmin=1vw
vmax:选取 vw 和 vh 中最大的那个 ,即在手机竖屏时，1vmax=1vh
6.响应式图片
在移动端中，图片的处理应该是很谨慎的。假设有一张图片本身的尺寸是X宽，设置和包裹它的div一样宽，
如果是div宽度小于图片宽度没有问题，
但是如果div宽度大于图片的宽度，图片则会被拉伸失真
解决方法：让图片最大只能是自己的宽度

img {
		max-width: 100%;
		display: block;
		margin: 0 auto;
		
	}

7.phone及ipad下输入框默认内阴影

input{
	    -webkit-appearance:none;
	}

8.如何解决iOS设置中 input按钮样式会被默认样式覆盖的问题？

	input,
	textarea {
		border:0；
		-webkit-appearance:none；
	}

9.如何防止手机中页面放大和缩小？

10.pc端与移动端字体大小的问题/在旋转屏幕时，如何解决字体大小自动调整的问题

  html{
        -webkit-text-size-adjust:100%;
	}

11.如何解决 Android手机圆角失效问题？
通过 background-clip:padding-box为失效的元素设置样式。
12.如何通过HTML5调用 Android或iOS的拨号功能？

< a href="te1:021-12345678">单击拨打021-12345678</a>

13.移动端适配

弹性布局（Flexbox）
	 媒体查询
		Rem与Viewport单位（px to ren）
	 uniapp使用

14.如何解决上下拉动滚动条时出现卡顿的现象？

body {
		 -webkit-overflow-scrolling:touch; 
		overflow-scrolling:touch;
	}