我是html和css的新手，我刚刚在xd adobe上设计了样本网站。附件是它的图片。html工作，但当我在css部分工作，它是不工作，它不显示在网站上。我在一个scss文件编码，而不是css文件。我将感激任何帮助!你可以看到我在css文件中写了logo应该是没有下划线的但是它仍然不起作用
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap");
body {
background: #F2F2F2;
font-family: 'Poppins';
margin: 0;
}
.navbar {
background: white;
padding: 1em;
.logo2 {
text-decoration: none;
font-weight: bold;
color: black;
font-size: 10em;
}
}
.container {
display: flex;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JustFly</title>
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<div class="navbar">
<div class="container">
<a class="logo2" href="#">JustFly</a>
<img id="mobile-cta" class="mobile-menu" src="images/menu.svg" alt="Hamburger Menu">
<nav>
<img id="mobile-exit" class="mobile-menu-exit" src="images/exit.svg" alt="Hamburger Menu">
<ul class="primary-nav">
<li class="current"> <a href="#">Home</a> </li>
<li> <a href="#">FAQ</a> </li>
<li> <a href="#">Pricing</a> </li>
</ul>
<ul class="secondary-nav">
<li> <a href="#">Contact</a> </li>
<li class="GoPremiumBtn"><a href="#">Buy Now</a> </li>
</ul>
</nav>
</div>
</div>
<section class="hero">
<div class="container">
<div class="col">
<h1 class="head">Fly Like Never Before.</h1>
</div>
<img id="mainImage" class="mainImage" src="images/icons8-fighter-jet-96.png" alt="Fighet Plane Image">
</div>
</section>
</body>
</html>
[Code][1]
[Output][2]
[Design][3]
[1]: https://i.stack.imgur.com/K19ny.png
[2]: https://i.stack.imgur.com/Iluoa.png
[3]: https://i.stack.imgur.com/fGDMf.png
您的代码看起来很好，也可以成功测试。唯一可能导致你的问题的是你的CSS文件的路径。
检查<link rel="stylesheet" href="css/main.css">中的路径是否正确
你说你正在使用scss的写作风格，所以你必须使用本地节点设置或可能使用ruby指南针的东西。
请检查您的本地开发设置是否在正确的路径上输出css文件。
如果使用node-sass
，应该尝试下面的命令sass --watch scss/main.scss:/css/main.css
然后添加到你的HTML
<link rel="stylesheet" href="./css/main.css">