PrimeFaces 2.2.1在本地看起来与展示不同

时间:2011-10-19 05:02:22

标签: css jsf primefaces

我见过类似问题herehere。这些都没有回答我的问题。我也搜索了PrimeFaces forum

在NetBeans中设置一个vanilla JSF 2.0项目,我添加了Simple Dialog的Showcase代码。

代码(index.xhtml)减去xml声明和DOCTYPE(XHTML 1.0 Transitional):

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:p="http://primefaces.prime.com.tr/ui">
<h:head>
    <title>PrimeFaces</title>
</h:head>
<h:body>
    <h:panelGrid columns="1" cellpadding="5">
        <p:commandButton value="Basic" onclick="dlg1.show();" type="button"/>

        <p:commandButton value="Modal" onclick="dlg2.show();" type="button"/>

        <p:commandButton value="Effects" onclick="dlg3.show();" type="button"/>
    </h:panelGrid>

    <p:dialog header="Basic Dialog" widgetVar="dlg1">
        <h:outputText value="Resistance to PrimeFaces is futile!" />
    </p:dialog> 

    <p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" height="200">
        <h:outputText value="This is a Modal Dialog." />
    </p:dialog> 

    <p:dialog header="Effect Dialog" widgetVar="dlg3" showEffect="bounce" hideEffect="explode" height="200">
        <h:outputText value="This dialog has cool effects." />
    </p:dialog>
</h:body>

我已将aristo主题添加到Libraries(NetBeans添加到类路径的方式)并将以下内容添加到web.xml

web.xml(部分):

<context-param>
    <param-name>primefaces.THEME</param-name>
    <param-value>aristo</param-value>
</context-param>

没有做出其他更改,虽然我快速安装/卸载了另一个主题(黑暗蜂巢),只是为了确保主题正确注册。结果如下:

本地(Chrome 15.0.874.92):

Screenshot of locally created site

展示:(来自PrimeFaces Showcase

enter image description here

堆栈:
PrimeFaces 2.2.1
JSF 2.0
Glassfish 3.1.1
Java 1.6.0_18
Windows 7 x64
(由NetBeans 7.0.1生成)

编辑:这也在FireFox 7.0.1和IE 9上进行了测试

2 个答案:

答案 0 :(得分:10)

问题不是默认的字体大小吗?我可以从showcase css看到它有自定义字体大小覆盖主题的默认值:

body {
    margin: 0px;
    padding: 0;
    font-size: 12px;
    color: #616161;
}

我检查了一些项目,所有项目都有一些font-size / font-family自定义。希望它有所帮助

答案 1 :(得分:5)

我读了你的3篇帖子。你有什么问题吗?你能更具体地描述一下你的问题吗?我的意思是,他们有多么不同?

如果是字体大小,请检查PrimeFaces' Document在第8.4章:主题提示:(用户指南3.4及更高版本中的第7.4章)

主题的默认字体大小可能比预期更大,以更改PrimeFaces的字体大小 组件全局,使用.ui-widget样式类。较小字体的示例;

.ui-widget, .ui-widget .ui-widget {
     font-size: 90% !important;
}

希望它可以帮助你:)