css - 初始比例 vs desktop css+phone css+tablet css?

  显示原文与译文双语对照的内容

我刚刚发现了初始比例元属性。

以前,我一直使用 default.css 来定义所有的样式和大小( 用于字体和元素),这样它们就能很好地显示在桌面计算机。 然后,我可以使用媒体查询或者PHP包括一个 phone.css 或者 tablet.css,如果你使用的是电话或者平板电脑。

但是现在我已经了解了初始比例的概念,应该使用它来控制元素的大小。

我尝试使用的一个非常重要的结果是。"。"。我用 em ( 或者 REM ) 单位定义字体大小:


/*desktop.css*/
html{font-size:62.5%;}
p{font-size:1.2em;}
span {font-size:1em;}

/*phone.css*/
html{font-size:125%;}

/*tablet.css*/
html{font-size:100%;}

换句话说,phone.css 和 tablet.css 只调整html元素的font-size 百分比,所有其他元素在所有不同的设备上都会相应地缩放。 在一定程度上,我用 padding,页边距,lineheights和字母间距来做这个。

引入初始比例后,是否意味着 em/rem单位与缩放字体大小无关? 我们可以用更直观的像素单位? 让初始比例完成剩下的缩放工作?

时间:

is单元在设备和屏幕密度上应该是相同的,因为实际的高度由客户端决定。

在几个应用程序中,我还使用了初始比例。最小比例和max比例。

...