primefaces组件不使用自己的css

Question

primefaces组件不使用自己的css

我在我的java ee应用程序中使用现成的模板(带有css和j查询).除了primefaces 3.2的panelgrid控件之外,所有的primefaces组件都被正确呈现.它以边框显示.我希望它没有边界.我已从自定义现成模板的CSS中删除了所有表格样式.边界还在那边.当我删除现成的模板时,panelgrid完美呈现没有任何边框.我如何删除边框,这是什么原因造成的？

编辑: 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:p="http://primefaces.org/ui">

<h:head>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AP administration panel - A massive administration panel</title>



</h:head>

<h:body>

    <div>
    <h:form>
        <p:panelGrid columns="2" style="border: none">
        <h:outputText value="scrip symbol"/>
        <p:inputText value=""/>
        <p:commandButton value="submit"/>
        </p:panelGrid>

    </h:form>


    </div>




</h:body>

</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Bal*_*usC 5

重写PrimeFaces默认样式时,必须指定至少具有相同强度的CSS选择器或指定更强的选择器.CSS选择器(级联规则)的强度在W3 CSS规范中指定,并在本文中进行了清楚解释:了解CSS中的样式优先级:特异性,继承和级联.

基于PrimeFaces自己的CSS,以下选择器应该:

.ui-panelgrid tr, .ui-panelgrid td {
    border: none;
}

Run Code Online (Sandbox Code Playgroud)

只需将它们放在一个.css文件中,然后将其包含在文件<h:outputStylesheet>的开头,<h:body>以便它包含在 PrimeFaces自己的样式之后.

<h:body>
    <h:outputStylesheet name="layout.css" />
    ...
</h:body>

Run Code Online (Sandbox Code Playgroud)

也可以看看:

更新:根据您的更新,您的CSS似乎根本没有加载.您应该通过验证浏览器内置webdeveloper工具集中的HTTP流量(在Chrome/IE9/Firebug中按F12)并看到它返回HTTP 404错误来注意到这一点.使用时<h:outputStylesheet>,需要将CSS文件放在/resourceswebcontent 的文件夹中.所以你必须有一个/resources/css/mycss.css才能使用<h:outputStylesheet name="css/mycss.css" />.

也可以看看:

如何在Facelets模板中引用CSS/JS /图像资源？

归档时间：	13 年，5 月前
查看次数：	10568 次
最近记录：	13 年，5 月前