reset.css引进和1px边框难题的处理方式

日期:2020-12-10 类型:科技新闻 

关键词:小程序 活动,微信小程序demo,微信小程序游戏开发价格,手机小程序怎么做,视频播放微信小程序

1、有关reset.css

由于不一样的访问器默认设置的款式不一样,因此在下手新项目刚开始前,大家必须引进reset.css,将全部html标识的默认设置款式统1化。我这里强烈推荐1个免费下载reset.css的网站:https://cssreset.com/,里边也有1些normalize.css之类的,大伙儿有兴趣爱好能够科学研究。

2、有关1px边框难题

由于自从retina屏以来,不一样的手机上又不一样的像素密度,css中的1px其实不等于挪动机器设备中的1px, 最立即的主要表现便是1px边框难题;简易说便是你给border的css写个1px,得手机上却变粗了显示信息成2px。
因此在新项目中大家引进1个border.css处理这个难题。

3、新项目中引进

1、新建styles文档夹

把reset.css和border.css粘贴到此:

reset.css

2、main.js中引进

main.js

3、配备相对路径

我感觉'./assets/styles/reset.css'这个相对路径过长了,因此大家在webapck.base.conf.js中的alias中配备下相对路径

配备相对路径

4、main.js中简化下相对路径引进


main.js

上面流程进行之后,由于改动了webpack里边的配备,因此大家必须npm run dev重新启动1下服务,ok。

总结

以上便是这篇文章内容的所有內容了,期待本文的內容对大伙儿的学习培训或工作中具备1定的参照学习培训使用价值,假如有疑惑大伙儿能够留言沟通交流,感谢大伙儿对脚本制作之家的适用。