使用SASS计算设备纵横比

时间:2018-06-19 09:52:20

标签: sass node-sass

首先,使用aspect-ratio媒体查询不是一种选择。它几乎不受任何浏览器的支持,因此使用它不是最好的主意。

目标是计算设备纵横比,然后有条件地应用SASS样式。理想(但不工作)的例子:

=aspect_ratio_landscape_apply()
  $device_aspect_ratio: calc(100vw / 100vh)
  @if $device_aspect_ratio > 1.8
    @content

所以它不起作用,因为我无法在SASS变量定义中使用CSS中的任何内容。我也无法在calc()中使用@if。有没有明智的解决方法?

对于那些好奇的人,我试图在横向模式下为边缘到边缘的移动设备有条件地添加左右边距(或其他一些样式)。如果您有任何其他方法,我也很乐意看一下。

请注意,将景观中的边对边移动设备视为桌面不起作用。视口高度不足以容纳那里所需的东西。

谢谢!

0 个答案:

没有答案