html - gratis - JSF/Facelets: el archivo CSS no se reconoce utilizando la etiqueta<h: outputStylesheet>
plantillas jsf gratis (2)
Agregar carpeta de recursos bajo el contenido web
y dentro de los recursos crear carpeta css
luego accede a los archivos como este
h:outputStylesheet library="css" name="myNewStylesFile.css" target="head"
en la sección h:head
que no agregó
Estoy trabajando en un proyecto usando JSF / Facelets. Quiero hacer algunos cambios de CSS en mi View XHTML, pero no sucede nada cuando implemento mi aplicación web en mi servidor Tomcat. He intentado muchos trucos pero tengo el mismo resultado.
De todos modos, aquí está mi "styles.css":
body { width: 750px; }
#header
{
width: 100%;
font-size: 36px;
font-weight: bold;
line-height: 48px;
background-color: navy;
color: white;
}
#footer
{
width: 100%;
font-weight: bold;
background-color: navy;
color: white;
}
Y esta es la plantilla principal "Template.html" que incluye "Header.html" y "Footer.html", donde coloco mi "styles.css" usando la etiqueta:
<!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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<h:outputStylesheet name="css/styles.css" />
<!-- i''ve also tried this one, using the "library" attribute -->
<!--
<h:outputStylesheet library="css" name="styles.css" />
-->
</head>
<h:body>
<h:panelGroup id="page" layout="block">
<h:panelGroup id="header" layout="block">
<ui:insert name="header">
<ui:include src="Header.html" />
</ui:insert>
</h:panelGroup>
<h:panelGroup id="container" layout="block">
<h:panelGroup id="content" layout="block">
<ui:insert name="content">CONTENT</ui:insert>
</h:panelGroup>
</h:panelGroup>
<h:panelGroup id="footer" layout="block">
<ui:insert name="footer">
<ui:include src="Footer.html" />
</ui:insert>
</h:panelGroup>
</h:panelGroup>
</h:body>
</html>
Finalmente, aquí está mi "Main.xhtml" que incluye la plantilla "Template.html":
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich" template="Template.html">
<h:body>
<ui:define name="content">
<h:form>
<h:inputText title="inputText"></h:inputText>
<h:commandButton value="OK"></h:commandButton>
</h:form>
</ui:define>
</h:body>
</ui:composition>
Gracias por adelantado :)
La <h:outputStylesheet>
(y <h:outputScript>
) requiere un <h:head>
, pero tienes un <head>
. Arreglarlo en consecuencia.
<h:head>
<h:outputStylesheet name="css/styles.css" />
</h:head>
Además, debe asegurarse de que el archivo css/styles.css
se haya colocado en la subcarpeta /resources
del contenido web público.
WebContent
|-- resources
| `-- css
| `-- styles.css
:
En cuanto a su intento de usar el atributo de library
, tenga cuidado con esto, usar library="css"
no es del todo correcto en este contexto. Vea también: ¿Para qué sirve la biblioteca de recursos de JSF y cómo debe usarse?