CSS не работает в браузерах, но работает в Eclipse - PullRequest
Новая
       9

CSS не работает в браузерах, но работает в Eclipse

0 голосов
/ 31 марта 2011

Я создаю страницы JSF с помощью таблиц стилей.Они, кажется, работают, когда я использую функцию предварительного просмотра в Eclipse, но, как только я тестирую их на IE8, они, кажется, не имеют никакого эффекта.

Я использую составные представления для определения общего макета страницы каксм. ниже. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <head>
        <link rel="stylesheet" type="text/css" href="/css/masterTemplateCSS/masterTemplateCSS.css" />


        <title><ui:insert name="title"></ui:insert></title>
    </head>

    <body>

        <div class="left_Sidebar">
            <ui:insert name="leftSidebar">

            </ui:insert>
        </div>  

        <div class="bulk_text">
            <ui:insert name="content">

            </ui:insert>
        </div>

        <div class="foot">
            <ui:insert name="footer">

            </ui:insert>
        </div>      

    </body>
</html>

Затем я пытаюсь проверить их. 

<ui:composition template="/templates/masterTemplate.xhtml">

    <ui:define name="title">Create Screen</ui:define>

    <ui:define name="leftSidebar">
        Left sidebar
    </ui:define>
    <ui:define name="content">

Шаблоны работают, и я уверен, что путь css правильный.Я также проверил css файлы с валидаторами, и они все проверили.Но он все еще работает в реальном браузере: S

1 Ответ

5 голосов
/ 31 марта 2011

Вам необходимо узнать, как работают относительные URL. Относительный URL файла CSS 

<link rel="stylesheet" type="text/css" href="/css/masterTemplateCSS/masterTemplateCSS.css" />

начинается с косой черты, поэтому оно относится к корню домена, а URL на самом деле указывает на http://localhost:8080/css/masterTemplateCSS/masterTemplateCSS.css

Очевидно, что это не сработает, если ваше веб-приложение развернуто не в корневом каталоге контекста, а в подконтекстном пути, например http://localhost:8080/contextname. Файл CSS должен указывать на http://localhost:8080/contextname/css/masterTemplateCSS/masterTemplateCSS.css.

Заменить ссылку на 

<link rel="stylesheet" type="text/css" href="#{request.contextPath}/css/masterTemplateCSS/masterTemplateCSS.css" />

Таким образом, он будет выглядеть как /contextname/css/masterTemplateCSS/masterTemplateCSS.css и, таким образом, будет указывать правильный абсолютный URL.

Do not замените его на путь файловой системы диска, как вы упомянули в комментарии. Это не будет работать вообще, когда веб-страница будет обслуживаться через Интернет. Ваши будущие веб-посетители, безусловно, не имеют вашего CSS-файла в собственной файловой системе на локальном диске.

...