css - SASS 和 SCSS 变量名的合法字符

标签 css sass

哪些字符可用于 SCSS 变量名?

最佳答案

如果您查看 SASS lexer 的来源,你会看到:

# A hash of regular expressions that are used for tokenizing.
REGULAR_EXPRESSIONS = {
  :whitespace => /\s+/,
  :comment => COMMENT,
  :single_line_comment => SINGLE_LINE_COMMENT,
  :variable => /(\$)(#{IDENT})/,
  :ident => /(#{IDENT})(\()?/,
  :number => /(-)?(?:(\d*\.\d+)|(\d+))([a-zA-Z%]+)?/,
  :color => HEXCOLOR,
  :bool => /(true|false)\b/,
  :null => /null\b/,
  :ident_op => %r{(#{Regexp.union(*IDENT_OP_NAMES.map{|s| Regexp.new(Regexp.escape(s) + "(?!#{NMCHAR}|\Z)")})})},
  :op => %r{(#{Regexp.union(*OP_NAMES)})},
}

其中引用了 IDENT separate file 中定义的字符集:

s = if Sass::Util.ruby1_8?
      '\200-\377'
    elsif Sass::Util.macruby?
      '\u0080-\uD7FF\uE000-\uFFFD\U00010000-\U0010FFFF'
    else
      '\u{80}-\u{D7FF}\u{E000}-\u{FFFD}\u{10000}-\u{10FFFF}'
    end

H = /[0-9a-fA-F]/
UNICODE = /\\#{H}{1,6}[ \t\r\n\f]?/

NONASCII = /[#{s}]/
ESCAPE = /#{UNICODE}|\\[ -~#{s}]/
NMSTART = /[_a-zA-Z]|#{NONASCII}|#{ESCAPE}/
NMCHAR = /[a-zA-Z0-9_-]|#{NONASCII}|#{ESCAPE}/

IDENT = /-?#{NMSTART}#{NMCHAR}*/

所以,看起来变量名可以包含:

  • 任何 ASCII 字母。
  • 任何数字 0-9(只要它不是名称中的第一个字符)。
  • 下划线和连字符。
  • ASCII 标点符号 ( !"#$%&'()*+,./:;<=>?@[]^{|}~ ) 和空格,如果使用反斜杠转义。
  • 0080-D7FF 范围内的 Unicode 字符, E000-FFFD , 或 10000-10FFFF .
  • Unicode 十六进制转义序列,例如 \00E4 .

关于css - SASS 和 SCSS 变量名的合法字符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17191265/

相关文章:

html - CSS 网格中的最后一行不适合我的 html

reactjs - Ant Design with sass in React with create-react-app

html - 如何在动态可变的 div 中定位按钮 div?

html - 是否有与@font-face 等效的内联?

css - uninitialized constant Sprockets::SassCacheStore Error on Windows (Learn ruby​​ on rails book)

intellij-idea - 在 WebStorm 中选择一个 sass 声明

css - 我如何用 sass 简化这个 css?

css - 我正在尝试将我的 SCSS 代码编译成 CSS,但未找到变量

javascript - Canvas 大小 HTML

HTML 列表 - 宽度问题