Question

我正在编写一个java servlet（struts / JSP等）。我试图在JSP页面中使用CSS设置进度条的样式，但在使用chrome的开发人员工具时会出现此错误：

资源被解释为图像但以MIME类型text / plain传输。

＆lt;％@ include file =“../ include / css / default.css”％＆gt;

在CSS文件中：

background：url（../ images / bg_bar.gif）no-repeat 0 0;

有人能解释为什么会这样，并展示我如何在我的页面中使用这个CSS？

Answer 1

是啊......我的问题出在哪里。你将css包含在@include中，所以它将整个css文件插入到你的html代码中。

结果如下：

localhost:8080/GraphBuilder/yourpage.htm

<html>
...
<style>
.myId {
background:url(../images/bg_bar.gif) no-repeat 0 0;
}
</style>
...

现在，查看页面的地址，您认为它会在哪里找到图像？确切地说，在localhost:8080/GraphBuilder/../images/bg_bar.gif - ＆gt; localhost:8080/images/bg_bar.gif。

您有2个选项可以解决它：

使用简单的<style type="text/css" src="include/css/default.css"/>代替@include。这将使其在路径localhost:8080/GraphBuilder/include/css/default.css中查找css。并且css将在localhost:8080/GraphBuilder/include/css/../images/bg_bar.gif - ＆gt;中查找图像localhost:8080/GraphBuilder/include/css/images/bg_bar.gif。
保留所有内容，但将css文件中的路径更改为“include / images / bg_bar.gif”。但是这个解决方案比第一个解决方案更差，因为在html文件中包含css很糟糕。

Answer 2

我的猜测是你得到一个错误页面而不是图像。尝试在浏览器中键入图像的完整路径，看看它是否有效。那就是：http://domain/app/include/images/bg_bar.gif

如果您收到错误 - 那么您的问题是公众无法访问您的图片。