Страница ASP.NET не загружает стили CSS

Это простой веб-сайт в ASP.NET с С# с использованием VS 2010. У меня есть следующая структура каталогов для этого проекта:

Стартовая страница - Default.aspx и она загружается отлично. Но когда я открываю страницу Interface/SystemAdminLogin.aspx со страницы по умолчанию, она загружается без стилей CSS. Я импортировал таблицу стилей CSS на главной странице. Вот как я ссылаюсь на файл MasterPage в обоих файлах.aspx:

Default.aspx:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

SystemAdminLogin.aspx:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="SystemAdminLogin.aspx.cs" Inherits="_Default" %>

Я не вижу ошибок с моим кодом, но почему Страница в интерфейсе не загружает стили CSS? Пожалуйста помоги.

Вот код главной страницы, где я импортирую файл css:

 <%@ 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" rel="stylesheet" type="text/css" media="screen" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>

И вот часть кода файла CSS:

body {
margin: 0;
padding: 0;
background: #fff url(../images/img01.jpg) repeat-x left top;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000;
}

Ответ 1

Таблицы стилей, включенные в основную страницу, используют относительные пути.

Укажите ссылки на таблицу стилей с runat=server и префикс их с помощью корневого пути виртуальной сети (~):

<link href="~/Styles/style.css" rel="stylesheet" type="text/css" media="screen" runat="server" />

ИЛИ:

<link href="/Styles/style.css" rel="stylesheet" type="text/css" media="screen" runat="server" />

Но имейте в виду, что рекомендуется использовать первый вариант. Второй не будет работать, когда вы публикуете свой сайт в виртуальном каталоге.

После последнего комментария...

URL-адрес изображения в CSS также должен быть обновлен, чтобы не использовать относительные пути или пройти путь (../).

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

Для этой опции вам нужно будет переместить папку изображений в папку "Стили" (это хорошая практика для этого).

Окончательное обновление:

Похоже, что элемент head также должен быть runat=server чтобы относительные пути ASP.NET(~) работали в элементах link с runat=server.

Ответ 2

Это работает для меня на моих главных страницах:

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

Ответ 3

Попробуйте (~ на вашем пути):

<%@ 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>

Ответ 4

Это работает для меня на моих главных страницах:

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

Ответ 5

Добавьте runat = "server" в атрибут head, а также убедитесь, что ссылка нацелена на корень, как в ("~/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>