p:layout和p:layoutUnit忽略样式

Question

我的问题很简单.我正在使用PrimeFaces 4.0和布局组件.

当我尝试调整CSS时,问题就来了.我想把它的背景设置为无,我尝试了经典,style="background: none !important但它忽略了我,然后我检查谷歌浏览器中的元素,看到.ui-widget-content风格是我想要隐藏的那个然后我试试这个:

<p:layout style="min-width:400px;min-height:1000px; .ui-widget-content {background: none !important;}">
<p:layoutUnit position="west" size="620" minSize="40" style=".ui-widget-content {background: none !important;}">

但它仍然无效.另外,在我的css主题中,我有:

body .ui-widget-content {

    border-style: hidden;
    border-color: white;
    border-width: 0px;
    color: #4f4f4f;
}

如果我添加背景:无,它确实有效,但搞砸了我整个应用程序的主题.有没有办法隐藏单个小部件内容的背景？

Answer 1

不要乱用style属性.只需给它一个你在CSS文件中声明的类.

<p:layout styleClass="backgroundless">

.ui-layout-container.backgroundless .ui-widget-content {
    background: none;
}

也可以看看:

• 如何使用自定义样式覆盖默认的PrimeFaces CSS？
• CSS初学者教程