CSS 錯誤編譯

Question

我在為 OceanGrownFin.com 編寫我的網站時遇到了一些問題。 如果您滾動瀏覽網站，我遇到的三個部分是事件的 CSS 背景、我的視頻彈出和我的 twitter 提要。 在每個文件中，我都進入了 .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.less NameError: 變量 @black-color 在 C:\\ 中未定義用戶\\皇家\\桌面\\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;

然后嘗試編譯文件。