Шаблонирование и попытка ссылки на контекстный путь из файла CSS - PullRequest
3 голосов
/ 21 августа 2010

Я работаю с JSF и XHTML-шаблонами , я использую CSS-файл в шаблонах, фоновые изображения называются как:

background-image: url("../../images/imageFile.jpg");

Поскольку я использую шаблоны, я обнаружил, что я должен сохранять одинаковую глубину как для страниц, так и для стилей / изображений, чтобы страницы применяли стили правильно, но в проекте были изменения, и теперь требуется переменная глубина для папок и страниц. больше не жизнеспособен.

Тогда мой вопрос:

Есть ли способ заменить относительные пути (../../, ../ и т. Д.) На контекстный путь (<%Request.getContextPath()%>, #{facesContext.requestContextPath} и т. Д.), Внутри файла CSS?

----- UPDATE -----

Об абсолютных путях не может быть и речи. Мне нужно, чтобы мои страницы на основе шаблонов (какой бы глубины они ни были) могли найти ресурсы стиля и изображения, на которые ссылается мой файл CSS.

В настоящее время это возможно, только если страницы, стили и изображения имеют одинаковый уровень глубины в структуре папок приложения, но я больше не могу придерживаться этого подхода, потому что новые требования проекта мешают мне сделать это.

Пример структуры файлов моего проекта: <root> путь к корню приложения:

CSS (глубина-2): <root>/styles/global/myStyles.css Включает стили со ссылками на глубину-2, такими как:

background-image: url("../../images/imageFile.jpg");

изображения (глубина-2): <root>/images/basic/imageFile.jpg

шаблонов (глубина-2): <root>/template/general/template1.xhtml

страница (глубина-2): <root>/pages/folder1/page1.xhtml (работает нормально)

страница (глубина-N): <root>/pages/folder1/.../folderN/page2.xhtml (неработающие изображения и стили)

Ответы [ 2 ]

5 голосов
/ 21 августа 2010

Эти пути относятся к URL-адресу запроса самого файла CSS.Мне кажется, довольно просто сгруппировать их на том же корневом уровне, что и сам файл CSS.Например, /css для файлов CSS и /css/images для фоновых изображений CSS.Таким образом, вы можете использовать url('images/name.ext') полностью.

Я не понимаю, как полезно каждый раз менять пути.Просто соблюдайте их последовательность и, при необходимости, четко документируйте, чтобы это было понятно всем сейчас и в будущем.

0 голосов
/ 10 мая 2012

У меня такая же проблема в проекте JSF2, в файле css вы не можете получить доступ к contextPath или подобному.

В css вы можете определить один и тот же селектор (#headerImg в моем случае) несколько раз, результирующий css является объединением свойств, в случае конфликта выигрывает последний загруженный.

поэтому я оставляю в файле css только свойства, которым не нужен какой-либо путь, затем изменяю селектор css в моем файле шаблона root 'xhtml', например

<load css files >
    <style type="text/css">
#headerImg {
    background: url("${request.contextPath}/resources/images/header.jpg") no-repeat scroll center center #FFCC3D;
}
[...]
</style>
...