Фоновое изображение формы на сайте. Мастер

Я перепробовал все, чтобы изображение отображалось в качестве фона. Он работает на моей локальной установке Visual Studio Express, но при загрузке на хост-сервер в Интернете он не будет отображаться должным образом. У меня была такая же проблема с фоновым изображением заголовка, но я нашел решение, которое работает, но такое же решение не будет работать с фоном формы.

Если я помещу те же теги стиля фонового изображения в div class="page", он будет отображаться как на моей среде разработки, так и на хост-серверах в Интернете, но я хочу, чтобы моя страница была поверх этого изображения (т. е. кодовые страницы моего приложения находятся поверх этого фонового изображения).

Есть идеи или предложения?

Site.Master Code Snippet

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="MyApp.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" xml:lang="en">
<head runat="server">
    <title><%=Page.Title %></title>
    <link href="~/Styles/site.css" rel="stylesheet" type="text/css" />
    <link id="Link1" runat="server" rel="shortcut icon" href="~/favicon.ico" type="image/x-icon"/>
    <link id="Link2" runat="server" rel="icon" href="~/favicon.ico" type="image/ico"/>
    <asp:ContentPlaceHolder ID="HeadContent" runat="server">
    </asp:ContentPlaceHolder>
    <style type="text/css">
        .style1
        {
            text-align: center;
        }
    </style>

    <script runat="server">

    protected void Page_Load(object sender, EventArgs e)
    {

    }
     /* this code statement below is what I used to solve the header banner issue 
        but does not work for form background
     */
    public string imgHeaderPath = System.Web.VirtualPathUtility.ToAbsolute("~/Images/water-banner.jpg");


</script>
</head>
<body >
 <form runat="server" style="background-position: left top;  background-repeat: repeat; background-attachment: fixed; background-image: url('/Images/willnotdisplay.jpg')">

    <div class="page">

          <div class="header" style="background-image: url('<%= imgHeaderPath %>')">     
            <div class="title">                
                    <h1>&nbsp;<asp:Localize ID="Localize1" runat="server"  Text="<%$ Resources:Resource, Title %>" /></h1>
            </div>
.
.
.

1 ответ

Вы должны быть в состоянии просто сделать

<div class="header" style="background-image: url('/Images/water-banner.jpg')">

без накладных расходов на использование imgHeaderPath

Это, вероятно, не будет отображаться на вашем компьютере разработчика

В качестве альтернативы вы можете добавить следующее в ваш файл site.css

div.header {background-image: url('/Images/water-banner.jpg');}

и удалите атрибут стиля в div, который должен работать как на Dev, так и на Production.

Другие вопросы по тегам