RichFaces CSS无法正常工作 [英] RichFaces CSS not working
问题描述
我正在尝试使用Richfaces开发我的第一个应用程序,为此,我使用了来自RF站点的样本.
I'm trying develop my first aplication with richfaces, to do this I'm using samples from rf site.
此刻,我尝试通过下面的链接开发下拉菜单
In this moment I try develop dropdown menu as link below
http://showcase.richfaces.org/richfaces/component -... nu& sample = topMenu& skin = classic
但是我不能更改栏菜单的颜色.
But I can't change color of bar menu.
我想要这个:
但是我有这个:
我在netbeans中工作,并为JSF(带有facelets)项目添加了丰富的功能.我只是添加了richfaces的jar和css文件,仅此而已.
I'm working in netbeans and have added richfaces to a JSF (with facelets) project. I just added the jar and css files of richfaces, nothing more.
在我的facelet模板和菜单文件下面:
Bellow my facelet template and my menu file:
<?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">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="./../../resources/css/default.css" rel="stylesheet" type="text/css" />
<link href="./../../resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
<title>Facelets Template</title>
</h:head>
<h:body>
<div id="top" >
<ui:insert name="top">Top</ui:insert>
<ui:include src="topo.xhtml" />
</div>
<div>
<div id="left">
<ui:insert name="left">Left</ui:insert>
</div>
<div id="content" class="left_content">
<ui:insert name="content">Content</ui:insert>
</div>
</div>
</h:body>
</html>
topo.xhtml
<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<ui:composition>
<h:outputStylesheet name="estilo">
.pic {
margin-bottom: -4px;
margin-right: 2px;
}
.search .rf-ddm-itm-sel {
background-color: transparent;
background-image:none;
border-color: transparent;
cursor: default;
}
</h:outputStylesheet>
<h:form>
<rich:toolbar height="26px">
<rich:dropDownMenu mode="ajax">
<f:facet name="label">
<h:panelGroup>
<h:graphicImage value="../resources/images/icon_client.jpg" styleClass="pic" alt="cliente" />
<h:outputText value=" Clientes" />
</h:panelGroup>
</f:facet>
<rich:menuItem label="Novo Cliente" ></rich:menuItem>
<rich:menuItem label="Consultar"></rich:menuItem>
</rich:dropDownMenu>
</rich:toolbar>
</h:form>
<a4j:outputPanel ajaxRendered="true">
<h:outputText value="Current Selection: "></h:outputText>
<h:outputText style="font-weight:bold" value="#{dropDownMenuBean.current}"></h:outputText>
</a4j:outputPanel>
<br />
</ui:composition>
</html>
怎么了?
推荐答案
1)如果要使用RichFaces皮肤,请添加 web.xml
1) If you want to use RichFaces skin, then add in web.xml
<context-param>
<param-name>org.richfaces.skin</param-name>
<param-value>#{lookAndFeel.skin}</param-value>
<!-- blueSky, classic, DEFAULT, deepMarine, ruby, emeraldTown -->
</context-param>
<context-param>
<param-name>org.richfaces.enableControlSkinning</param-name>
<param-value>false</param-value>
</context-param>
<context-param>
<param-name>org.richfaces.enableControlSkinningClasses</param-name>
<param-value>true</param-value>
</context-param>
2)如果要使用 css ,则将链接从模板模板文件中的 h:header
移至 h:body
这个
2) If you want to use your css, then move your links from h:header
into h:body
in template file like this
<h:body>
<link rel="stylesheet" type="text/css"
href="#{request.contextPath}/css/basic.css" media="all" />
</h:body>
这篇关于RichFaces CSS无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!