숨기기 "이외의 요소"코드에 따라 CSS

사용 :숨기기 "이외의 요소"코드에 따라 CSS

<li> 
    <a href="...">bla</a> 
    <span>blabla</span> 
    hidethistext 
</li>

가 어떻게 다른 모든 것들에 영향을주지 않고 CSS를 사용하여 display:none로 "비 요소" "hidethistext을"숨길 수 있습니까? 의미, 올바른 선택기는 무엇입니까? :not(..)을 사용해 보았지만 올바른 접근 방식이 아닌 것처럼 보였습니다.

출처

2016-09-19 drhirn

수 없습니다. CSS를 사용하면 요소 만 선택할 수 있습니다. :not 선택자는 클래스가 아닌 x 인 요소를 선택하는 데 사용되며 id가 y이 아니거나 z이 아닌 요소를 선택하는 데 사용됩니다. 그러나 hidethistext은 텍스트 노드 일 뿐이며 선택할 수 없습니다. 유일한 해결책은 <span/> 요소의 첫 번째 클래스 다음에 다른 클래스를 두는 것입니다. span

출처

2016-09-19 12:33:19 giorgio

당신 말이 맞아요. 불행히도, 나는 코드를 생성하는 사람이 아니며, 이는 애플리케이션에 의해 수행됩니다. 나는 그것을보기 좋게하기 위해 단지 여기에있다. 그래서 나는 그것을 'span'으로 감쌀 수 없다. – drhirn

또는 사람에게 전화를 걸어서 스팬에 포장하고 싶은지 물어보십시오. 자바 스크립트를 사용하여 역동적으로 할 수도 있습니다. 그게 차선책이긴하지만 ... – giorgio

phabricator.wikimedia.org에서 버그를 보내 드리겠습니다.). 실제로 자바 스크립트에 대해서도 생각했습니다. 당신이 말하는 것처럼, 차선책은 아니지만 시도 할 가치가 있습니다. – drhirn

오버플로 할 수 있으므로 visibility 속성을 사용할 수 있습니다. 여기 this jsfiddle에

<li> 
    <a href="...">bla</a> 
    <span>blabla</span> 
    hidethistext 
</li>

CSS

/* hide all elements (including textnode "hidethistext" */ 
li { 
    visibility: hidden; 
} 

/* set other elements to visible */ 
li span, li a { 
    visibility: visible; 
}

예.

숨기기 "이외의 요소"코드에 따라 CSS

답변

관련 문제