Использовать CSS ссылки на изображения на страницах JSP - PullRequest
0 голосов
/ 16 июня 2010

Я пишу сервлет Java (Struts / JSP и т. Д.). Я пытаюсь стилизовать индикатор выполнения с помощью CSS на странице JSP, но получаю эту ошибку при использовании инструментов разработчика chrome:

Ресурс интерпретируется как изображение, но передается с текстом MIME типа / обычный.

<% @ include file = "../ include / css / default.css"%>

И в файле CSS:

background: url (../ images / bg_bar.gif) без повтора 0 0;

Может кто-нибудь объяснить, почему это так, и показать, как я могу использовать этот CSS на своей странице?

Ответы [ 2 ]

2 голосов
/ 16 июня 2010

Ааа ... Я понял, где твоя проблема.Вы включаете 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 -> localhost:8080/images/bg_bar.gif.

У вас есть 2 варианта решения:

  1. Вместо @include используйте простой <style type="text/css" src="include/css/default.css"/>.Это заставит его искать css в пути localhost:8080/GraphBuilder/include/css/default.css.И css будет искать изображение в localhost:8080/GraphBuilder/include/css/../images/bg_bar.gif -> localhost:8080/GraphBuilder/include/css/images/bg_bar.gif.
  2. Оставьте все как есть, но измените путь в файле css на «include / images / bg_bar.gif».Однако это решение хуже первого, так как включение CSS в HTML-файл отстой.
0 голосов
/ 16 июня 2010

Я предполагаю, что вместо изображения появляется страница с ошибкой.Попробуйте набрать полный путь к изображению в вашем браузере и посмотрите, работает ли он.То есть: http://domain/app/include/images/bg_bar.gif

Если вы получили ошибку - ваша проблема в том, что ваши изображения не доступны для общественности.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...