网站被做跳转,wordpress 判断文章页,网站制作好了怎么上传,怎样开通微信小商店现在的电脑屏幕和尺寸越来越多样化#xff0c;对于前端开发来说#xff0c;适配各种屏幕成了大难题#xff0c;开发中一个实际例子#xff1a;开发一个导航栏#xff0c;ui给的是1920*60的尺寸#xff0c;前端开发的时候#xff0c;在自己电脑缩放比例中开发的#xff… 现在的电脑屏幕和尺寸越来越多样化对于前端开发来说适配各种屏幕成了大难题开发中一个实际例子开发一个导航栏ui给的是1920*60的尺寸前端开发的时候在自己电脑缩放比例中开发的但是到了其他人屏幕比如2k屏幕或者缩放200%的笔记本上高度就不一样了为了解决这个问题今天就来研究下怎么在各种分辨率下高都都保持不变完全按照ui尺寸写 试过了根元素设置zoom和scale但是效果都不理想各种其奇奇怪怪bug 第一步首先安装依赖
npm install lib-flexible-computernpm install postcss-px2rem-exclude 第二步在main.ts中导入
import lib-flexible-computer
第三步vite.config.ts配置
和server平级 css: {postcss: {plugins: [postCssPxToRem({remUnit: 192, // 设计稿宽度/10exclude: /(node_modules)/ //过滤三发ui样式不进行转换})]}},