所以我一直在嘗試讓 SASS 為一個項目工作，但由于某種原因嵌套不想為我工作？當我將 .header-menu 的片段移到嵌套之外時，它工作得很好，只是沒有嵌套？這是index.html的代碼：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Portfolio</title> <link rel="stylesheet" href="../stylesheets/scss/style.scss"> <script src="../Javascript/includeHTML.es6"></script></head><header> <div w3-include-html="../Elements/Header.html"></div> <script>includeHTML()</script></header><body class="homepage"><p>hallo dit is een test</p></body></html>這是頭文件的代碼：<!DOCTYPE html><html><head> <link rel="stylesheet" href="../stylesheets/scss/style.scss"></head><header><div class="header"> <h1>Pointbreak</h1> <div class="header-menu"> <ul> <li>Who am I?</li> <li>My work</li> <li>Contact</li> </ul> </div></div></header></html>這是 style.scss，請注意，“&-menu”和“.header-menu”都不起作用：.header { background-color: white; &-menu { background-color: red; } .header-menu { background-color: orange; }}.homepage { background-color: lightgray;}最后是編譯后的 CSS 代碼：.header { background-color: white;}.header-menu { background-color: red;}.header .header-menu { background-color: orange;}.homepage { background-color: lightgray;}/*# sourceMappingURL=style.css.map */我希望我提供了足夠的信息，如果沒有，請告訴我。
2 回答
叮當貓咪
TA貢獻1776條經驗 獲得超12個贊
回答
因此，經過一夜好眠后，我找到了答案，你們在某種程度上都很好，這鼓勵我去其他地方看看。
問題是我鏈接了錯誤的樣式表，這是我在查看開發工具中的網絡請求后才發現的。
在那里我看到它正在加載 style.scss 文件，而瀏覽器當然無法讀取它。應該是CSS文件。
所以我更改了文件夾和文件：
<link rel="stylesheet" href="../stylesheets/scss/style.scss">到：
<link rel="stylesheet" href="../stylesheets/css/style.css">
交互式愛情
TA貢獻1712條經驗 獲得超3個贊
&您可以在 的開頭放置另一個&-menu以將其嵌套在其中.header。
.header {
background-color: white;
& &-menu {
background-color: red;
}
.header-menu {
background-color: orange;
}
}
編譯后的CSS：
.header {
background-color: white;
}
.header .header-menu {
background-color: red;
}
.header .header-menu {
background-color: orange;
}
- 2 回答
- 0 關注
- 164 瀏覽
添加回答
舉報
0/150
提交
取消