为什么很多web项目还是使用px,而不是rem?
在移动终端刚刚流行的初期,为了使手机页面适应不同大小的手机屏幕,淘宝的一位前端老板编写了一个经过改编的js,叫做flexible,可以在github找到。原理很简单。似乎根据手机的分辨率和dpi(我不记得了),动态设置根元素html的fontsize,然后页面元素的大小就是rem,因为1rem=fontsizeofhtml。
后来,出现了大众和vh。渐渐地,许多项目使用大众汽车进行改编。100vw=100%宽度。因为兼容性不是很好,所以一直没有上线。
nodejs出现后,前端工程开始了。有pxtorem和pxtoviewport等插件。在开发过程中,我们可以根据ui标记的pxcase直接编写它们。在打包时,插件将帮助我们将px计算转换为rem或vw。
我现在用大众。不考虑兼容性。我甚至不看那些需要与ie兼容的公司。px是一个固定的像素,不能适应流的布局。通常,高度由px设置,web应用版本的宽度由rem.2设置。em是相对于父元素的字体大小单位。因为它是相对于父元素的字体大小单位,所以如果要设置元素的宽度和高度,必须查看其父元素的大小。如果父对象也是em单位,则必须转到其父对象并逐层计算以获得准确的像素值。
3.rem的出现改变了许多移动终端的适应性,因为rem指的是相对于根元素的字体大小单位。只要html根上的字体大小是根据屏幕大小设置的,rem中的元素大小就会相应地改变。
前端开发中px,em,rem这些单位有哪些不同之处?
怎么快速将css中的px替换成rem?
随着技术的更新和迭代,前端工作变得越来越繁重和复杂。
css技术就像一个数学问题。它有太多的可变性。这就是困难所在。例如,您可以清楚地看到11=2,但是您是否需要考虑11000-101100123的问题?
随着css3的出现,css不再简单,css3动画、变形、渐变、过滤器等
布局有弹性、网格等。就像数学问题一样,任何组合都是一种新类型的问题,变得极其复杂。所以学好基础知识更重要,要有各种知识,扎实的基础知识,看问题类型,有自己的想法,有多种解决方法,不受限制。css有复杂和困难的样式,我们可以使用多种解决方案,比如canvas、svg、真不图像等等。
原文标题:1rem等于多少px 为什么很多web项目还是使用px,而不是rem?,如若转载,请注明出处:https://www.saibowen.com/wenda/24228.html
免责声明:此资讯系转载自合作媒体或互联网其它网站,「赛伯温」登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述,文章内容仅供参考。