每当我试图给h1、h3或任何img一个类，并试图在我的style.css文件中进行编辑时，它没有做任何更改，但是当我try 内联CSS时，它工作得很好.我正在使用Bootstrap 4.
在这里，我添加了CSS内联，这就是它可以工作的原因，但是当我试图通过瞄准一个类来在style.css中添加CSS时，它没有显示效果.
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300&display=swap');
body {
font-family: "Montserrat";
}
#title {
background-color: #ff4c68;
color: #fff;
}
.container {
padding: 3% 15%;
}
p {
color: #8f8f8f;
}
/* Navigation bar */
.navbar-brand {
font-family: "Ubuntu";
font-weight: bold;
}
.nav-item {
padding: 0 18px;
}
.nav-link {
font-family: "Ubuntu";
font-size: 1.2rem;
font-weight: bold;
}
/* Download buttons */
.download-button {
margin: 5% 3% 5% 0;
}
/* Title image */
.title-image {
width: 60%;
transform: rotate(25deg);
}
/* feature sectiom */
#features {
padding: 7% 15%;
}
.feature-box {
text-align: center;
padding: 5%;
}
.icon {
color: #ef8172;
margin-bottom: 1rem;
}
.icon:hover {
color: #ff4c68;
}
/* testimonial section */
#testimonials {
padding: 7% 15%;
text-align: center;
background-color: #ef8172;
color: #fff
}
#testimonial-image {
width: 10%;
border-radius: 100%;
margin: 20%;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>tindog</title>
<!-- css file link -->
<link rel="stylesheet" href="/css/styles.css">
<!-- font awsome kit -->
<script src="https://kit.fontawesome.com/b5209fc970.js" crossorigin="anonymous"></script>
<!-- bootstrap css link -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<!-- bootstrap js -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</head>
<body>
<section id="title">
<div class="container">
<!-- Nav Bar -->
<nav class="navbar navbar-expand-lg navbar-dark" style="padding: 0 0 4.5rem;">
<a class="navbar-brand" href="" style="font-size: 2.5rem">tindog.</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="">Contact</a>
</li>
<li class="nav-item">
<a class="nav-link" href="">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="">Download</a>
</li>
</ul>
</div>
</nav>
<!-- Title -->
<div class="row">
<div class="col-lg-6">
<h1 style="font-family: Montserrat; font-size: 3.5rem; line-height: 1.5;">Meet new and interesting dogs nearby.</h1>
<button type="button" class="btn btn-dark btn-lg download-button"><i class="fa-brands fa-apple"></i> Download</button>
<button type="button" class="btn btn-outline-light btn-lg download-button"><i class="fa-brands fa-google-play"></i> Download</button>
</div>
<div class="col-lg-6">
<img class="title-image" src="images/iphone6.png" alt="iphone-mockup">
</div>
</div>
</div>
</section>
<!-- Features -->
<section id="features">
<div class="row">
<div class="feature-box col-lg-4">
<i class="icon fa-solid fa-circle-check fa-4x"></i>
<h3 style="font-family: Montserrat ; font-size: 1.5rem;">Easy to use.</h3>
<p>So easy to use, even your dog could do it.</p>
</div>
<div class="feature-box col-lg-4">
<i class="icon fa-solid fa-bullseye fa-4x"></i>
<h3 style="font-family: Montserrat ; font-size: 1.5rem;">Elite Clientele </h3>
<p>We have all the dogs, the greatest dogs.</p>
</div>
<div class="feature-box col-lg-4">
<i class="icon fa-solid fa-heart fa-4x"></i>
<h3 style="font-family: Montserrat ; font-size: 1.5rem;">Guaranteed to work. </h3>
<p>Find the love of your dog's life or your money back.</p>
</div>
</div>
</section>
<!-- Footer -->
<footer id="footer">
<p>© Copyright TinDog</p>
</footer>
</body>
</html>