首页 > 作文

小程序如何实现rem

更新时间:2023-04-07 06:34:05 阅读: 评论:0

最近在学习小程序,要把html的代码转换成小程序界面,其中就遇到了rem的转换问题,但小程序不太兼容rem,不是不能用rem,而是没办法设置根元素的font-size,因为rem是相对于根元素的font-size,而小程序的根元素font-size一直是16px。既然我设置影视动画专业了page{ font-size:1px }也不起作用,那要怎么实现rem呢

这里我用css变量来实现伪rem,定义一个css变量–app-rem-size,然后在各个屏幕尺寸中定义–app-rem-size大小值;

以下是app.wxss文件

page{    --app-rem-size:10px;  font-size:calc(var(--app-rem-size)*1.2);}@media screen and (min-width: 320p彩虹的句子短唯美x) and (max-width: 359px) {     page {         --app什么叫奇函数-rem-size: 1五行相生0px;     }}@media screen and (min-width: 360px) and (max-width: 413px) {     page {         --app-rem-size: 12px;     }}@media screen and (min-width: 414px) {    page {        --app-rem-size: 14px;     }}        

然后在我需要用到rem的地方,比如 height:calc(var(–app-rem-size层进式议论文)*2) 这样使用,虽然有点麻烦,但也是没办法中的办法了。

本文发布于:2023-04-07 06:34:04,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/fanwen/zuowen/1effb014b82fd79b5af197657c995330.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

本文word下载地址:小程序如何实现rem.doc

本文 PDF 下载地址:小程序如何实现rem.pdf

标签:程序   没办法   变量   元素
相关文章
留言与评论(共有 0 条评论)
   
验证码:
Copyright ©2019-2022 Comsenz Inc.Powered by © 专利检索| 网站地图