admin管理员组

文章数量:1426338

I am trying to build my site but i face this problem and for two days i tried to solve it but i failed . the browser refuse to apply css page only for this page while another pages in my site work fine with css this is my code for problem page

<!DOCTYPE html>
<html lang="en">
 <head>
<%include partails/head %>

<link rel="stylesheet"  href="../stylesheets/resultPage.css"/>
</head>
<body>
<% include partails/header %>
<h3 class="h3 mb-3 font-weight-normal text-center" id="title">نتيجة 
الأختبار</h3>
<div class="container">
<div class="row">
<div class="col-md-10">

and this is my app.js code to upload css file

app.use(express.static("public"));
app.set("view engine" , "ejs");
app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json())
app.use(methodOverride("_method"));

and this is my file path

  • Samples10
    • public
      • stylesheets
        • resultPage.css
    • View
      • resultPage.ejs

and last thing this is the text error i got from browser

Refused to apply style from 'http://localhost:3000/result/5b31bbcacc2864263d40d240/stylesheets/resultPage.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

please can anyone help ? Thank you

I am trying to build my site but i face this problem and for two days i tried to solve it but i failed . the browser refuse to apply css page only for this page while another pages in my site work fine with css this is my code for problem page

<!DOCTYPE html>
<html lang="en">
 <head>
<%include partails/head %>

<link rel="stylesheet"  href="../stylesheets/resultPage.css"/>
</head>
<body>
<% include partails/header %>
<h3 class="h3 mb-3 font-weight-normal text-center" id="title">نتيجة 
الأختبار</h3>
<div class="container">
<div class="row">
<div class="col-md-10">

and this is my app.js code to upload css file

app.use(express.static("public"));
app.set("view engine" , "ejs");
app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json())
app.use(methodOverride("_method"));

and this is my file path

  • Samples10
    • public
      • stylesheets
        • resultPage.css
    • View
      • resultPage.ejs

and last thing this is the text error i got from browser

Refused to apply style from 'http://localhost:3000/result/5b31bbcacc2864263d40d240/stylesheets/resultPage.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

please can anyone help ? Thank you

Share Improve this question asked Jul 9, 2018 at 2:04 Mohammed AlotaibiMohammed Alotaibi 331 gold badge1 silver badge3 bronze badges 3
  • 2 Possible duplicate of Stylesheet not loaded because of MIME-type – Obsidian Age Commented Jul 9, 2018 at 2:06
  • Some things worth that could be worth checking: are the pages that are working in the same directory as the page that fails? Is the relative path ../stylesheets/resultPage.css correct for all of them? Is the failing page being sent an html page to report a 404 error? – traktor Commented Jul 9, 2018 at 3:15
  • yes they are in same directory . no each page has own stylesheet ,but header and footer all the pages share style of header and footer and it works except this page. yes the page loaded html but without css style – Mohammed Alotaibi Commented Jul 9, 2018 at 6:32
Add a ment  | 

2 Answers 2

Reset to default 4

Refused to apply style from 'http://localhost:3000/result/5b31bbcacc2864263d40d240/stylesheets/resultPage.css'

Look at that URL.

Now look at where your static files are (in the public directory):

app.use(express.static("public"));

Now look at where the CSS is inside the public directory:

public/stylesheets/resultPage.css

So the URL to the stylesheet will be:

http://localhost:3000/stylesheets/resultPage.css

The HTML document is presumably at:

http://localhost:3000/result/5b31bbcacc2864263d40d240/something/

… so your relative URL:

href="../stylesheets/resultPage.css"

… which only goes up one level resolves to the wrong place!

Use an absolute path to start at the root of the site:

href="/stylesheets/resultPage.css"

another wrong is miss write <% include ../partials/head %>

本文标签: javascriptRefused to apply style fromStack Overflow