사용 CSS 비 앵커 요소

Question

내가 링크 제외하고 모든 것을 숨길이

<div id="container">This container has a <a href="#">link</a> in it</div> 

처럼 보이는 용기가를 숨 깁니다.

나는

#container {display:none;} 
#container a { display:block; } 

을 시도했다 그러나 그것은 작동하지 않습니다.

사용자 스타일이므로 CSS에만 액세스 할 수 있습니다. Javascript가 없습니다. 마크 업 없음.

Answer 1

.

#container { 
visibility: hidden; 
} 
#container a { 
visibility:visible; 
} 

그리고 당신은 디스플레이 블록 스타일을 모방해야하는 경우, 당신은 시도 할 수 있습니다 : 영업 이익이 페이지에 액세스 할 수 없습니다로

#container { 
visibility: hidden; 
position: relative; 
} 
#container a { 
visibility:visible; 
position: absolute; 
top: 0; 
left: 0; 
} 

Answer 2

현재 사용중인 코드로는 불가능합니다. 텍스트 조각은 anonymous inline boxes으로 만 표현되는 텍스트 노드이므로 display과는 별도로 스타일을 지정할 수 없습니다.

하지만 a 요소를 둘러싼 텍스트를 요소에 넣으면 (예 : span의 :

<div id="container"><span>This container has a </span><a href="#">link</a><span> in it</span></div> 

이 그럼 당신은이 작업을 수행 할 수 있습니다 당신은 눈에 보이지 않는 비 연결된 텍스트는 여전히 공간을 차지 괜찮다면 여기에 작동 visibility를 사용

#container span { display: none; } 
#container a { display: block; }