ASP.NET page is not loading CSS styles

前端未结

关注

 6  997

梦毁少年i

This is a simple website in ASP.NET with C# using VS 2010. I have following directory structure for this project:

相关标签:

6条回答

轮回少年

2020-12-16 14:45

Add runat="server" to the head attribute and also ensure the link targets the root as in ("~/path to css")

<head runat="server">
    <title>Page Title Here</title>
    <link href="~/css/main.css" rel="stylesheet" type="text/css" />
    <asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</head>

0 讨论(0)

心在旅途

2020-12-16 14:53

This works for me in my master pages:

<asp:content ID="xContent" ContentPlaceHolderID="headContent" runat="server">
<link rel="stylesheet" type="text/css" href="<%=Request.ApplicationPath%>Folder/Folder/Filename.css" />
</asp:Content>

0 讨论(0)

甜味超标

2020-12-16 14:56

Try with (~ in your path):

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="SiteMaster" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Facial Recognition Bank System</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="~/Styles/style.css" runat="server" rel="stylesheet" type="text/css" media="screen" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>

0 讨论(0)

囚心锁ツ

2020-12-16 14:58

This works for me in my master pages:

<asp:content ID="xContent" ContentPlaceHolderID="headContent" runat="server">
<link rel="stylesheet" type="text/css" href="<%=Request.ApplicationPath%>Folder/Folder/Filename.css" />
</asp:Content>'

0 讨论(0)

庸人自扰

2020-12-16 15:01
The stylesheets included in your master page are using relative paths.

Specify your stylesheet links with runat=server and prefix them with the virtual web root path (~):
```
<link href="~/Styles/style.css" rel="stylesheet" type="text/css" media="screen" runat="server" />
```
OR:
```
<link href="/Styles/style.css" rel="stylesheet" type="text/css" media="screen" runat="server" />
```
But keep in mind that the first option is recommended. The second will not work when you publish your site in a virtual directory.

After last comment...

The image URL's in CSSs should be updated as well, in order to not use relative paths or do any path traversal (../).

background: #fff url(images/img01.jpg) repeat-x left top;

For this option you will need to move the images folder inside the Styles folder (it's a good practice to do so).

Final update:

Looks like that the head element also needs to be runat=server in order for ASP.NET relative paths (~) to work within link elements with runat=server.
0 讨论(0)
发布评论:

提交评论
- 加载中...

滥情空心

2020-12-16 15:03

I found that it was ASPNETCORE_ENVIRONMENT set to Development for debug. And in the _Layout.cshtml I had the asp-append-version missing.

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - SALUS UAV</title>

<environment include="Development">
    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="~/css/site.css" />
</environment>
<environment exclude="Development">
    <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"
          asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
          asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
    <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>

I fixed that and it was all good again:

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - SALUS UAV</title>

<environment include="Development">
    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</environment>
<environment exclude="Development">
    <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"
          asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
          asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
    <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>

0 讨论(0)