• scss-字符串连接符


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

    // 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!"; 
    }
  • 相关阅读:
    spark的做算子统计的Java代码(在Linux系统集群式运行)
    http协议面试题
    vue响应式原理
    vue-cli3搭建vue项目
    vscode中自定义代码片段
    vue中常用的全局配置
    tomcat安装配置
    Git相关
    nginx配置文件详解
    nginx源码安装
  • 原文地址:https://www.cnblogs.com/ibabyli/p/9870633.html
Copyright © 2020-2023  润新知