gpt4 book ai didi

css - less.js 是否编译浏览器兼容的 css 代码?

转载 作者:行者123 更新时间:2023-11-28 07:00:24 35 4
gpt4 key购买 nike

有没有一种方法可以在 less 中轻松地将 less 代码编译为以下浏览器兼容的 css 代码?

#grad1 {
background: -webkit-linear-gradient(red, blue); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(red, blue); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(red, blue); /* For Firefox 3.6 to 15 */
background: linear-gradient(red, blue); /* Standard syntax (must be last) */
}

还是我必须手动完成?

另外我意识到我的 less 代码没有按字母顺序编译,我正在使用以下命令行 lessc (less file) (css file)

最佳答案

是的,你可以创建 mixins 来做你想做的事:

.grad1() {
background: -webkit-linear-gradient(red, blue); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(red, blue); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(red, blue); /* For Firefox 3.6 to 15 */
background: linear-gradient(red, blue); /* Standard syntax (must be last) */
}

然后在要添加此背景的地方调用它:

.class-with-grad1 {
.grad1();
/** other less/css stuff **/
}

一旦你的 less 被编译,你将得到:

.class-with-grad1 {
background: -webkit-linear-gradient(red, blue);
background: -o-linear-gradient(red, blue);
background: -moz-linear-gradient(red, blue);
background: linear-gradient(red, blue);
/** other less/css stuff **/
}

Documentation for less mixins

关于css - less.js 是否编译浏览器兼容的 css 代码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33270998/

35 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com