我正试图将样式表链接到我目前正在使用express和node.js构建的应用程序。问题是，如果我点击inspect/sources，样式表将被链接到网页。我可以看到它被链接，里面的代码也被链接，但它没有应用到我的网页。
样式表保存在public/stylesheets/app.css.下
我在app.js:上的代码
var express = require("express");
var mongoose = require("mongoose");
var bodyParser = require("body-parser");
var app = express();
// Mongoose Config
mongoose.connect("mongodb://localhost/restful_blog_app");
app.set("view engine", "ejs");
app.use(express.static(__dirname + '/public'));
app.use(bodyParser.urlencoded({extended:true}));
var blogSchema = new mongoose.Schema({
title:String,
image:String,
body:String,
created:{type: Date, default: Date.now}
});
var Blog = mongoose.model("Blog", blogSchema);
// RESTFUL ROUTES
app.get("/", function(req,res){
res.redirect("/blogs")
});
app.get("/blogs", function(req,res){
Blog.find({},function(err,blogs){
if(err){
console.log(err);
} else{
res.render("index.ejs", {blogs: blogs});
}
});
});
app.get("blogs/new", function(req,res){
res.render("new.ejs");
});
app.listen(process.env.PORT || 3000, process.env.IP, function(){
console.log("Server started!!!");
});
包含在header.ejs:中的
<!DOCTYPE html>
<html>
<head>
<title>Blog App</title>
<link rel="stylesheet" type="text/css" href="./stylesheets/app.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.css" integrity="sha512-+AdxWMqfOdtwMuXK482e5OgHYzN06s97n3NTAeAdTlUvlIgCBx3SUKvMculJIedylDfVCaQFdD6HaojI4aeBUA==" crossorigin="anonymous" />
<script type="text/javascript" rel="https://code.jquery.com/jquery-3.5.1.js"></script>
</head>
<body>
<div class="ui fixed inverted menu">
<div class="ui container">
<div class="header item"><i class="paper plane outline icon"></i>Blog Site</div>
<a href="/" class="item">Home</a>
<a class ="item" href="/blogs/new">New Post</a>
</div>
</div>
样式表中的代码
i.icon{
font-size: 2em;
}
.container.main{
margin-top: 7.0em;
}
body{
background-color:red;
}
我也在使用风格的语义UI
所以问题出在多个样式表的链接顺序上。
最初的订单是：
这意味着首先读取并应用应用程序样式表，然后应用语义ui的样式表。
如果某个东西在两个样式表中都应用了样式，则后者将优先于前者(假设选择器专用性相同，并且不应用！important(。
您可以在此处阅读更多关于优先级的信息：https://css-tricks.com/precedence-css-order-css-matters/
解决了它：问题似乎是我把样式表的链接放在了UI语义idk的链接之前，为什么这会是一个问题，但至少它解决了它。
顺便说一句，如果有人知道为什么会发生这种互动，请留下解释
css文件的路径似乎错误