背景图像不显示在服务器中
[英]Background image not displaying in server
问题描述
I'm trying to host an web application in server but the problem is when i run the application in localhost the background image is displaying but when i host it on server particularly background image is not at all loading please help regarding this 
我正在尝试在服务器中托管一个Web应用程序，但问题是当我在localhost中运行应用程序时，背景图像正在显示但是当我在服务器上托管它时特别是背景图像没有加载请关于此的帮助
here is the code 这是代码
<!DOCTYPE html> <html> <head> <style> body,h1 {font-family: "Raleway", sans-serif} body, html {height: 100%} .bgimg { background-image: url('~/img/smpl4.jpg'); min-height: 100%; background-position: center; background-size: cover; } </style> </head> <body class=" bgimg" > </body> </html>
how can i solve this ? 我怎么能解决这个问题？
i'm able to get images from gridview button 我可以从gridview按钮获取图像
<asp:ImageButton ID="imgbtnEdit" style="margin-left:5px" runat="server" ToolTip="Edit" CommandName="Edit" ImageUrl="~/img/edit.png" Height="32px" Width="32px"/>
the images over here is perfectly loading its not able to load background image. 这里的图像完全加载它无法加载背景图像。
when i inspected the page its coming like this 当我检查页面时它会像这样来
Failed to load resource: the server responded with a status of 404 (Not Found) 无法加载资源：服务器响应状态为404（未找到）
7 个解决方案
解决方案1
0 2017-02-18 06:04:23
You cannot use the root path operator ~ in client-side code, that is only available for code being run by .NET. 您不能在客户端代码中使用根路径运算符~ ，该代码仅适用于.NET运行的代码。 <ImageButton ImageUrl= "~/img/edit.png" /> works because it is being run server side. <ImageButton ImageUrl= "~/img/edit.png" />有效，因为它正在运行服务器端。
Change to an absolute path, or a relative path without the root element. 更改为绝对路径或没有根元素的相对路径。 Something like ../img/smpl4.jpg . 类似于../img/smpl4.jpg 。 Depending on your server setup you may also be able to access via /img/smpl4.jpg . 根据您的服务器设置，您也可以通过/img/smpl4.jpg访问。
It sounds like you need to figure out what the correct URL should be, and get this to load by manually typing it into the browser. 听起来你需要弄清楚正确的URL应该是什么，并通过手动将其输入浏览器来加载它。 In Chrome, right click on one of your images (one that is displaying correctly), then click Inspect Element. 在Chrome中，右键单击其中一个图像（一个正确显示），然后单击“检查元素”。 In the chrome dev tools you will then see the full URL for your image. 在chrome dev工具中，您将看到图像的完整URL。 Use the working URL as an example for how to access your other image. 使用工作URL作为如何访问其他图像的示例。
解决方案2
0 2017-02-18 06:05:11
要在服务器上显示图像，您应该在转到图像所在目录后将图像权限更改为755。
chmod -R 755 smpl4.jpg
解决方案3
0 2017-02-18 06:13:34
maybe check your filename (fontCase)? 也许检查你的文件名（fontCase）？ smpl4.jpg? smpl4.jpg？ smpl4.JPG? smpl4.JPG？
:) :)
解决方案4
0 2017-02-18 06:18:17
Make sure that the extension of the image matches with the code. 确保图像的扩展名与代码匹配。 The uploaded image extension has to be smpl4.jpg not smpl4.JPG 上传的图片扩展名必须是smpl4.jpg而不是smpl4.JPG
This won't affect locally but on server side the image won't be visible. 这不会影响本地，但在服务器端，图像将不可见。 Check the extension of the image and change it to lower case as like on your code smpl4.jpg. 检查图像的扩展名并将其更改为小写，就像在代码smpl4.jpg上一样。 Upload that image and check. 上传该图片并检查。
解决方案5
0 2017-02-18 07:29:16
{I CANNOT WRITE COMMENT So i have copied suhas response comment} {我不能写评论所以我复制了suhas回复评论}
yeah i set the path sample.net/sample/img/smpl4.jpg its working fine but my doubt is, is there any difference between /img/smpl4.jpg because it loading from server directory and that's loading from internet does it effects security of the page i'm beginner please explain – Suhas 是的，我设置路径sample.net/sample/img/smpl4.jpg它的工作正常，但我的疑问是，是什么区别/img/smpl4.jpg因为它从服务器目录加载和从互联网上加载它会影响安全性我初学者的页面请解释 - Suhas
Explanation: 说明：
Suhas you have set '~/' or '/' when you point to root directory.
解决方案6
0 2017-02-20 02:09:22
or maybe is wrong path? 或者可能是错误的道路？ is it write in index.html like this? 是这样写在index.html吗？
workspace/
workspace/img/smpl4.jpg
workspace/css/style.css
workspace/index.html
if in index.html 如果在index.html中
write url('img/smpl4.jpg') 写url('img/smpl4.jpg')
if in style.css 如果在style.css中
write url('../img/smpl4.jpg') 写url('../img/smpl4.jpg')
解决方案7
0 已采纳 2017-02-21 04:45:37
我正在使用图像的直接网址 ，现在它的工作正常，它通过http网址直接加载图像
background-image: url('http://www.sample.com/sample/img/smpl4.jpg');
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.