html - CSS 错误编译

Question

我在为 OceanGrownFin.com 网站编程时遇到了一些问题。如果您滚动浏览该网站，我遇到麻烦的三个部分是事件的 CSS 背景、我的视频弹出窗口和我的推特提要。对于其中的每一个，我都进入了 .less 文件并指向了我想要使用的图片，但由于某种原因它没有显示。例如:

.cbx-event {
    background: url(/assets/img/shows_bg.png)no-repeat center fixed;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    color: #ffffff;
    .cbx-inner {
        .bg-rgba(@black-color, 0.8);
        padding: 11rem 0 11.4rem;
    }

    .cbx-heading {
        h2 {
            i {
                color: @white-color;
                span {
                    background: @white-color;
                }
            }

        }
    }

这是我的 event.less 文件中使用的代码。我被告知我需要编译这些 .less 文件，我尝试使用 Koala 和 WinLESS 来完成这些文件。在这两个程序上，当我尝试编译时都收到此错误:

C:\Users.........\themeforest-17690374-musix-music-band-html-template\ogf\assets\less\event.lessNameError:变量@black-color 在 C:\Users\royal\Desktop\OG FIN WEB\themeforest-17690374-musix-music-band-html-template\ogf\assets\less\event.less:14:17 中未定义

13     .cbx-inner {
14         .bg-rgba(@black-color, 0.8);
15         padding: 11rem 0 11.4rem;

抱歉，如果这太详细了，我只是想确保我提供了所有的信息。我对 HTML 有一定的了解，但我不是一个出色的编码员，所以它可能非常简单。

Answer 1

如错误中所述并在此处解释 http://lesscss.org/您需要定义变量。

所以在你的样式之前，在文件的顶部，或者在另一个带有变量的文件中，你将在其他所有定义颜色之前加载/导入它:

@black-color: #000000;
@white-color: #FFFFFF;

然后尝试编译文件。