CSS康貝選擇

Question

我想知道是否有是針對以下CSS類更簡單的方法，因爲它會導致膨脹的一點點：

我有不同的單頁，在這裏我想禁用粘頭效果，因爲其他元素被用於固定在該頁面上。到現在爲止我用選擇那些類：

.page-id-xx .header-is-sticky .header { 
position: static; 
} 

如果我想禁用20頁，我結束了使用20次以上的選擇類粘頭，但只有頁面-ID-XX將更改。它會是這樣的：

.page-id-1 .header-is-sticky .header, 
.page-id-2 .header-is-sticky .header, 
.page-id-3 .header-is-sticky .header, 

and so on ... 

我想知道，如果有針對.header類更智能的方式，可能與一些combiselectors的幫助？或者有一個快速的JavaScript片段？也許一個if循環通過檢查元素的ID（#subnav），它應該粘滯在頁面上的標題上？

感謝提前:)

Answer 1

可能不必要的特殊性？

你絕對需要的家長選擇（即page-id-n），如果沒有的話，顯然下面的是相當多的優雅：

.header-is-sticky .header { 
    position: static; 
} 

以CSS選擇器的優勢

CSS提供了一系列attribute selectors，可用於根據各種屬性的各種約束來定位某些元素。開始與包含選擇器應符合您的需求。

/* This will match any element that has a class attribute that starts with "page-id" */ 
[class^="page-id"] .header-is-sticky .header { 
    position: static; 
} 

/* This will match any element that has a class attribute that contains "page-id" */ 
[class*="page-id"] .header-is-sticky .header { 
    position: static; 
}