Less 转义

  • 定义

    它动态构建选择器,并使用属性或变量值作为任意字符串。
  • 示例

    下面的示例演示了LESS文件中转义的用法-

    escaping.html

    <!doctype html>
    <head>
        <link rel = "stylesheet" href = "style.css" type = "text/css" />
    </head>
    <body>
        <h1>使用转义的示例</h1>
        <p>LESS支持自定义,网站的可管理和可重复使用的样式表。</p>
    </body>
    </html>
    
    
    现在让我们创建一个与CSS非常相似的文件style.less,唯一的区别是它将以.less扩展名保存。 .html和.less这两个文件都应在 F 盘的文件夹lesscode内创建。

    style.less

    p {
        color: ~"green";
     }
    
    
    使用以下命令将style.less文件编译为style.css-
    PS F:\lesscode> lessc style.less style.css
    
    
    当您运行上述命令时,它将自动创建style.css文件。 每当您更改LESS文件时,都需要在cmd中运行上述命令,然后style.css文件将得到更新。
    运行以上命令时,style.css文件将具有以下代码-

    style.css

    p {
        color: green;
     }
    
    
    将LESS代码编译为CSS代码后,写在〜“ some_text”中的所有内容都将显示为some_text。
  • 输出结果

    现在让我们执行以下步骤,看看上面的代码如何工作-
    将上面的html代码保存在 escaping.html 文件中。
    在浏览器中打开此HTML文件,将显示以下输出。
    less
    如果不懂以上命令操作,请先阅读我们 Less 安装