css - 基于当前屏幕宽度的手写笔(css)计算

Question

我想做类似

的事情

.findcol1 > img
        max-width 1.5em
        max-height 1em
        @media screen and (min-width 700px)
                max-width [1.5 + Math.floor("current_screen_width"/700)]em
                max-height [1 + Math.floor("current_screen_width"/700)]em

如何在手写笔中执行此操作？

(所以最大宽度应该像 -
1.5em 宽度介于 0px 和 699px 之间
2.5em 宽度介于 700px 和 1399px 之间
3.5em 宽度介于 1400px 和 2099px 之间，依此类推)

Answer 1

选项 1 -

.findcol1 > img
        width 1.5em
        height 1em
        @media screen and (min-width 700px) and (max-width 1399px)
                width 2.5em
                height 2em
        @media screen and (min-width 1400px) and (max-width 2099px)
                width 3.5em
                height 3em

选项 2 -(近似解)

$emval = calc((700px - 1em) + 1em)
// find number of em's in 700px

.findcol1 > img
        width 1.5em
        height 1em
        @media screen and (min-width 700px)
                width "calc((100% - %s + 1.5em)" % $emval
                // Subtract em's in 700px from em's in current screen size 
                // and add to original width
                height @width/1.5
                // If aspect ratio is not 1.5, we can do 
                // height "calc((100% - %s + 1em)" % $emval
                // Here ^^ 100% will equal 100% height of parent element
                max-width 3em
                max-height 2em 

floor() 仅适用于实数，不适用于 Stylus 中的变量!