css - 少 @import 不起作用

Question

<head>
    <link rel="stylesheet/less" href="less/news.less">
</head>
<body>
    <script src="less.js"></script>
</body>

news.less 看起来像这样；

@import: "libs/base.less"

base.less 看起来像这样；

@import "colors.less";
@import "mixins.less";
@import "bootstap.less";
@import "font-aweseome.less"

body {
    background-color: @light-grey;
}

bootstrap.less 和 font-awesome.less 是带有更改扩展名的 CSS 文件。所有文件都在正确的文件夹中。

在浏览器中查看时，base.less 中的样式被忽略，这意味着我的导入不起作用。

任何人都可以提供任何提示吗？

谢谢！

score 51 · Accepted Answer

您的@import陈述必须遵循以下格式：

@import "styles.less";

@import "font-aweseome.less"不起作用，因为末尾没有分号。

@import: "libs/base.less"将不起作用，因为 import 语句后有一个冒号。

score 4 · Accepted Answer

为什么冒号在：

@import: "libs/base.less"

我认为毕竟@import-s 最好有一个分号。

查看控制台以确保路径正确，并且浏览器不会尝试从错误的 url 加载更少的文件。

score 0 · Accepted Answer

0

Try this: @import url('Your Path');

于 2017-07-21T14:17:28.180 回答

score 0 · Accepted Answer

0

to import is

@import "styles.less";

于 2018-04-06T01:39:37.253 回答

score -1 · Accepted Answer

1.在 news.less 中导入你的 base.less，

    @import "libs/base.less";

2.在html中引用你的news.less文件

    <link  rel="stylesheet/less" type="text/css"  href="less/news.less"/>

3.Refer less.js library in the html

    <script src="lib/less.js"></script>

5 回答 5