什么是本义?
某些时候,当须要引入有效的 CSS 语法或 Less 不能辨认的字符,就须要应用转义字符。Less 中的转义字符就是在字符串后面加上一个 ~
符号,并将须要本义的字符串放在 ""
或 ''
中,例如 ~"xkd"
。本义容许你应用任意字符串作为属性或变量值。
本义的应用
个别状况下咱们是不须要用到本义的,只有在代码不能被失常编译的状况下,才须要应用本义。上面咱们来举一个例子阐明一下。
示例:
例如 border-radius
属性,在 CSS 中咱们能够应用斜杆 /
来设置属性值,/
后面的是程度半径,前面的是垂直半径。然而在 Less 中,则不反对应用 /
,如下所示:
.box{
width: 100px;
height: 100px;
border: 1px solid #000;
border-radius: 0px 25px 25px 0 / 0 25px 25px 0px;
}
执行 lessc index.less index.css
命令编译代码:
能够看到上图中报了一个语法错误,这种状况下,咱们就能够应用本义符将斜杆 /
进行本义,如下所示:
.box{
width: 100px;
height: 100px;
border: 1px solid #000;
border-radius: 0px 25px 25px 0 ~"/" 0 25px 25px 0px;
}
本义后,再次执行命令,能够看到胜利编译后的 CSS 代码如下所示:
.box {
width: 100px;
height: 100px;
border: 1px solid #000;
border-radius: 0px 25px 25px 0 / 0 25px 25px 0px;
}
总结
本义在 Less 中用的并不是很多,只有当代码不能被辨认时,才须要应用本义,任何 ~"text"
被编译成 CSS 代码后,都将显示为 text
。