css - 手写笔迭代字符串

Question

我想将我所有的媒体查询放入一个对象中，然后循环遍历它们。它运行良好，但手写笔迫使我在括号之间输出。我的问题是有没有办法删除括号和引号？

我的代码:

$maxBreakpoints = {
  "0": 'and (min-width: 1701px) and (max-width: 1920px)',
  "1": 'and (min-width: 1440px) and (max-width: 1700px)',
  "2": 'and (min-width: 1280px) and (max-width: 1439px)',
  "3": 'and (min-width: 1024px) and (max-width: 1023px)'
}

$_resolution = {
  "0": 1920,
  "1": 1440,
  "2": 1280,
  "3": 1024
}

for $i, $resolution in $maxBreakpoints

  @media all $resolution

这段代码的输出是:

@media all ('and (min-width: 1440px) and (max-width: 1700px)')

Answer 1

您需要将all 移动到字符串中:

$maxBreakpoints = {
  "0": 'all and (min-width: 1701px) and (max-width: 1920px)',
  "1": 'all and (min-width: 1440px) and (max-width: 1700px)',
  "2": 'all and (min-width: 1280px) and (max-width: 1439px)',
  "3": 'all and (min-width: 1024px) and (max-width: 1023px)'
}

$_resolution = {
  "0": 1920,
  "1": 1440,
  "2": 1280,
  "3": 1024
}

for $i, $resolution in $maxBreakpoints

  @media $resolution