前端设置画布的高度_前端如何解决pc端屏幕显示设置缩放比例对页面布局的影响？...

(加上兼容)写好以后的代码类似：

@media all

and (-moz-min-device-pixel-ratio: 1.09) and (-moz-max-device-pixel-ratio: 1.18),

(-webkit-min-device-pixel-ratio: 1.09) and (-webkit-max-device-pixel-ratio: 1.18),

(min-resolution: 1.09dppx) and (max-resolution: 1.18dppx) {

:root {

font-size: 14px;

}

}

@media all

and (-moz-min-device-pixel-ratio: 1.19) and (-moz-max-device-pixel-ratio: 1.28),

(-webkit-min-device-pixel-ratio: 1.19) and (-webkit-max-device-pixel-ratio: 1.28),

(min-resolution: 1.19dppx) and (max-resolution: 1.28dppx) {

:root {

font-size: 13px;

}

}

@media all

and (-moz-min-device-pixel-ratio: 1.29) and (-moz-max-device-pixel-ratio: 1.4),

(-webkit-min-device-pixel-ratio: 1.29) and (-webkit-max-device-pixel-ratio: 1.4),

(min-resolution: 1.29dppx) and (max-resolution: 1.4dppx) {

:root {

font-size: 12px;

}

}

@media all

and (-moz-min-device-pixel-ratio: 1.41) and (-moz-max-device-pixel-ratio: 1.6),

(-webkit-min-device-pixel-ratio: 1.41) and (-webkit-max-device-pixel-ratio: 1.6),

(min-resolution: 1.41dppx) and (max-resolution: 1.6dppx) {

:root {

font-size: 10px;

}

}

@media all

and (-moz-min-device-pixel-ratio: 1.61) and (-moz-max-device-pixel-ratio: 1.8),

(-webkit-min-device-pixel-ratio: 1.61) and (-webkit-max-device-pixel-ratio: 1.8),

(min-resolution: 1.61dppx) and (max-resolution: 1.8dppx) {

:root {

font-size: 9px;

}

}

@media all

and (-moz-min-device-pixel-ratio: 1.81) and (-moz-max-device-pixel-ratio: 2.1),

(-webkit-min-device-pixel-ratio: 1.81) and (-webkit-max-device-pixel-ratio: 2.1),

(min-resolution: 1.81dppx) and (max-resolution: 2.1dppx) {

:root {

font-size: 8px;

}

}