gpt4 book ai didi

java - primefaces 组件不能使用自己的 CSS

转载 作者:行者123 更新时间:2023-11-30 06:30:00 25 4
gpt4 key购买 nike

我在我的 java ee 应用程序中使用现成的模板(带有 css 和 j-queries)。除 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>

最佳答案

当覆盖 PrimeFaces 默认样式时,您必须指定 至少 相同强度的 CSS 选择器或指定 更强 选择器。 CSS 选择器的强度(级联规则)在 W3 CSS specification 中指定。并在本文中明确解释:Understanding Style Precedence in CSS: Specificity, Inheritance, and the Cascade .

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

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

只需将它们放在 .css 中即可您通过 <h:outputStylesheet> 包含的文件在 <h:body> 的开头里面以便在 PrimeFaces 自己的样式之后包含它。

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

另见:


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

另见:

关于java - primefaces 组件不能使用自己的 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10936982/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com