我的 css 样式表未在引导项目中应用 styles
[英]My css stylesheet not applying styles in bootstrap project
问题描述
我正在做一个项目，并注意到每当我将新的 styles 添加到我的 css 文件中时，它都不会应用它们中的任何一个。 这很奇怪。
这是我的 html 部分
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Book Landing Page</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<link href="https://fonts.googleapis.com/css?family=Poppins&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
</head>
如您所见，我的样式表位于引导链接下方，因此根据我的理解，它通常应该覆盖它。
这是迄今为止我添加到样式表中的 CSS
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
* {
box-sizing: border-box;
}
header, section {
overflow-x: hidden;
}
:root {
--Poppins:"Poppins", sans-serif;
--light-black: #2e2c2c;
--bggradient: linear-gradient
(
to bottom,
#dd2476, #ff512f
);
--light-gray: rgba(255,255,255,0.7);
}
header {
background-color: var(--bggradient);
到目前为止，这就是我的网站的样子： header 部分中的背景颜色应该已经改变
以及让 fonts 也发生变化。 谁能注意到我错过的任何东西？ 就是想不通：（
谢谢！
2 个解决方案
解决方案1
0 2019-11-21 12:16:56
您需要输入您的 css 文件夹。/css/style.css
解决方案2
0 2019-11-22 07:14:05
当您使用与引导框架中相同的 class 名称时。 为了使您的样式覆盖，您需要在 styles 之后添加!important important
像这样。
header, section {
overflow-x: hidden !important;
}
这将使其覆盖默认引导程序 styles。
注意：确保您正确引用了 css 文件
为什么我的 jQuery .css() 代码没有应用样式？
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.