我已经在网上搜索并搜索了这个问题的答案，但我还没有找到关于为什么会发生这种情况的“明确说明”的答案。而且我已经重新工作无济于事。
我有一个 Asp.Net 站点，有一个“母版页”和几个“内容”页
有一个 CSS 文件成功地在正文中为所有页面分配了“背景图像”:
body { background-image: url('../Images/TestImage1.jpg');我有另一张图片，比如 TestImage2.jpg，它位于解决方案中的同一个 Images 文件夹中，我想在特定的该页面加载时的“内容页面”。然而，它没有加载到页面上，背景变成白色，根本没有任何图像 - 这是我的代码:
我的 MasterPage 有 runat="server" 的正确项目:
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
……还有……
<body runat="server">
<form style="height: 906px" runat="server">
现在，这是我希望在 Page_Load 上显示新图像的内容页面的代码隐藏:
using System;
using System.Text;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class TechCall : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
StringBuilder script = new StringBuilder();
script.Append("<script type=\"text/javascript\">");
script.Append("document.body.style.background = \"url('../Images/CPUBack2nd.jpg')\";");
script.Append("document.body.style.backgroundRepeat = 'no-repeat';");
script.Append("</script>");
this.ClientScript.RegisterClientScriptBlock(this.GetType(), "changeBackground", script.ToString());
}
}
CPUBack2nd.jpg 是代替 TestImage2.jpg 的实际图像名称，但是据我所知，我使用的是正确的图像路径，就像 CSS 文件中定义默认背景图像的路径一样。然而，当页面加载时，背景根本没有图像 - 只是一个空白，原始图像正确显示在其他页面上。
有人可以检查并告诉我我在这里缺少什么吗？注意:请不要推荐JQuery，好像它可以用Javascript解决，那么我想坚持这个用法，因为我只是想学习让它与JS一起工作。
最佳答案
我建议根本不要使用 javascript。您应该在标题部分有一个方便的 ContentPlaceHolder。在其中添加以下内容以覆盖默认的主体样式
<style type="text/style">
body { background-image: url('../Images/TestImage2.jpg'); }
</style>
因为这将出现在母版页头部内容之后的页面中，所以它将覆盖之前的 CSS。
我也会考虑使用 Root Releative路径，特别是母版页上的路径，因为它使调用文档和被调用资源的相对位置无关紧要。在这种情况下，将上面的内容更改为:
<style type="text/style">
body { background-image: url('/Images/TestImage2.jpg'); }
</style>
假设 Images 目录位于文档的根级别。
如果你真的想坚持使用 javascript。检查路径或使用 Root Relative。请记住，该路径与调用资源的文档相关。因此，仅仅因为路径在 CSS 文件中有效并不意味着它在位于网站不同级别的页面中也有效。使用 CSS 调试工具，如 FireBug for Firefox(免费下载)或 Chrome 中的开发者工具(内置)来检查图像是否位于预期位置。
关于c# - Aspx 内容页面中的背景图像不会在页面加载时更改，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21517175/