css - 为特定组件设置样式

Question

我试图仅将样式应用于特定组件，但样式应用于整个页面，而不仅仅是子视图。有没有办法将样式仅应用于一个组件？

<f:subview>
    <ace:dialog id="pop" draggable="true" modal="true"
        visible="#{bean.popupVisible}" resizable="false"
        closeOnEscape="false" autoCentre="true" header="Details">
        <h:outputStylesheet>
            .ui-dialog-titlebar {
                width:400px;
            }
        </h:outputStylesheet>
...
</f:subview>

Answer 1

你的意思是只有 .ui-dialog-titlebar 当它在另一个元素内时？如果是这样，是的。你只需要像这样定义它：

.parent-element .ui-dialog-titlebar {
  width: 400px;
}

这些样式仅适用于位于 .parent-element 内的 .ui-dialog-titlebar。