首先是vue配scss.
安装:
npm install node-sass sass-loader --save
使用:在style标签上
<style lang=scss>注意:只能用sass/scss/css
app{
.box{
div{
}
}
}
</style>
2.移动端事件meta标签的使用
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
意思是当前设备屏幕有多宽,那么就按照多宽来渲染页面,这样就不会出现需要靠缩小或者左右移动来看完整个页面了。
<meta name="format-detection" content="telephone=no"/>
开启拨打电话/发送短信功能
<meta name="format-detection" content="telephone=no,email=no"/>
如果同样也需要禁止自动识别邮箱,可以在原来的基础上增加
WebApp全屏模式
<meta name="apple-mobile-web-app-capable" content="yes"/>
设置状态栏颜色
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
添加到主屏后的图标
<link href="图片的地址" sizes="114x114" rel="apple-touch-icon-precomposed"/>
添加到主屏后的标题
<meta name="apple-mobile-web-app-title" content="标题"/>
要是嫌麻烦的话,直接复制粘贴下面的到你的主页面❗💤
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="format-detection" content="telephone=no, email=no" />
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
希望有所帮助,喜欢的话,点个赞呗😆