하위 페이지의 하위에있는 경우 톱 메뉴 항목을 강조 표시하는 방법?

레벨 3 하위 페이지에있을 때 강조 표시되도록 최상위 메뉴 항목을 가져 오려고하지만 현재 페이지 조상 클래스를 사용할 때 한 단계 위로 강조 표시됩니다.하위 페이지의 하위에있는 경우 톱 메뉴 항목을 강조 표시하는 방법?

- Home 
- **Photos** 
    - **Album1** 
     - **Gallery1** (Current Page) 
    - Album2

는 (하나 개의 수준까지 부모가 선택 될 때) 내가 현재 가지고 있어요 무엇 :

- Home 
- Photos 
    - **Album1** 
     - **Gallery1** (Current Page) 
    - Album2

내가 (모든 메뉴 부모 강조)을 발생하는 것이

(아래 참조)

"Gallery1 Page"에있는 HTML :

<ul id="menu-menu-english" class="nav"> 
    <li id="menu-item-224" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-224">Home</li> 
    <li id="menu-item-158" class="menu-item menu-item-type-post_type menu-item-object-page current-page-ancestor menu-item-has-children menu-item-158 dropdown"><a title="Research" href="#" data-toggle="dropdown" class="dropdown-toggle" aria-haspopup="true">Research /a> 
    <ul role="menu" class=" dropdown-menu"> 
     <li id="menu-item-384" class="menu-item menu-item-type-post_type menu-item-object-page current-page-ancestor menu-item-384">Pre – 1975</li> 
     <li id="menu-item-383" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-383">1975-1990</a></li> 
    </ul> 
    </li> 
</ul>

CSS :

.current-page-ancestor { 
    background-color:red;

}

출처

2016-09-30 emcee

'css' 정의를 살펴 봐야합니다. 당신이'html'을 게시하지 않기 때문에 (나는 당신이해야합니다) 나는 어떤 추측도 할 수 없습니다. – Franco

많은 CSS 클래스가 Wordpress에 의해 생성되고 꽤 복잡하기 때문에 html 코드를 게시하기를 꺼립니다. 하지만 .current-page-ancestor가 효과적인 CSS 클래스라고 생각합니다. 그러나 그것을 정의 할 때 두 부모 모두 해당 클래스를 가지고 있더라도 두 번째 부모 만 강조 표시됩니다. – emcee

이것은 클래스 이름과는 아무런 관련이 없지만 요소 선택자에 관한 것입니다. – Franco

귀하의 코드가 분명하지 않습니다. parent에 이미 배경 스타일이 있기 때문에 작동하지 않을 수 있습니다. 이전 스타일을 덮어 쓰려면 !important을 추가하십시오.

.current-page-ancestor { 
     background-color:red !important; 
}

출처

2016-09-30 03:06:18

하위 페이지의 하위에있는 경우 톱 메뉴 항목을 강조 표시하는 방법?

답변

관련 문제