scss-字符串连接符

mac2022-06-30  13

  + 运算可用于连接字符串:

// SCSS p { cursor: e + -resize; } // 编译后的 CSS 样式 p { cursor: e-resize; }

  请注意,如果带引号的字符串被添加到不带引号的字符串中(也就是说,带引号的字符串在 + 的左侧), 

  那么返回的结果是带引号的字符串。同样,如果一个不带引号的字符串添加到带引号的字符串中(不带引号的字符串在 + 的左侧)那么返回的结果是一个不带引号的字符串。 例如:

// SCSS p:before { content: "Foo " + Bar; font-family: sans- + "serif"; } // 编译后的 CSS 样式 p:before { content: "Foo Bar"; font-family: sans-serif; }

  默认情况下,运算表达式与其他值连用时,用空格做连接符:

// SCSS p { margin: 3px + 4px auto; } // 编译后的 CSS 样式 p { margin: 7px auto; }

  在文本字符串中,#{}式插值可以用来在字符串中放置动态值:

// SCSS p:before { content: "I ate #{5 + 10} pies!"; } // 编译后的 CSS 样式 p:before { content: "I ate 15 pies!"; }

  在字符串插值时,Null值被视为空字符串:

// SCSS $value: null; p:before { content: "I ate #{$value} pies!"; } // 编译后的 CSS 样式 p:before { content: "I ate pies!"; }

 

转载于:https://www.cnblogs.com/ibabyli/p/9870633.html

最新回复(0)