1. 标签中的内容,触碰上会有蓝色的遮罩,去除方法:
a{
-webkit-tap-highlight-color:transparent;
}
2. 移动屏幕简单适配方案(解决不了1px边框的问题)
- 解决字体大小的问题
document.documentElement.style.fontSize = viewWidth/ratio +'px
- 视口宽的获取
viewWidth = document.documentElement.getBoudingClientRect().width||window.innerWidth
- ratio不是固定值,可以任意选择
ratio = 18.75
3.移动屏幕通用适配方案(可以解决1px边框的问题,考虑了设备像素比的问题)
1.考虑设备像素比
dpr = window.devicePixelRatio || 1;
scale = 1/dpr
content = 'width=device-width, initial-scale='+ scale +',maximum-scale='+ scale +',minimum-scale='+ scale +',user-scalable=no';
4.多行文字省略
.text {
/* 多行文字省略 */
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal !important;
word-wrap: break-word;
}