移动H5开发小计

1、border-radius  Android上圆角不圆问题

安卓部分低版本系统,不支持百分比(50%)的写法,把圆角改成比宽高远远要大的一个值就好了,并且快高度最好使用px,要不rem出现奇数可能也会导致不圆

.div{ 
    background-color: #f1464a; 
    width:4px; 
    height:4px; 
    border-radius:2px; 
}

2、移动端网站或APP点击后出现闪动或灰色背景

html,body{
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

3、解决输入框被虚拟键盘遮挡,自动滚动至可视区域

	window.addEventListener('resize',()=>{
		if(document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA'){
			setTimeout(()=>{
				//true:元素在可视区域中居中对齐
				//false:元素可能顶部或底部对齐,视乎元素靠哪边更近
				document.activeElement.scrollIntoViewIfNeeded(true);
			},400)
		}
	})

猜你喜欢

转载自blog.csdn.net/Mr_linjw/article/details/84861968
今日推荐