프로그래밍 공부 일기

2020년 7월 6일 Progate Lv.148
포트폴리오 작성 중

display:none이 작동하지 않는 원인

display:none 가 효과가 없는 원인을 조사해 보았다.

예기치 않게 display:block와 같이 display 속성이 사용됩니다

Fontawesome의로드가 CSS를로드하기 전에로드됩니다.

선택기가 잘못되었습니다

아무도 확인해 보았지만 해결하지 않았다 ...dislay:none 가 효과가 없었기 때문에, 다른 방법으로 요소를 숨겼다.

visibility 속성

display:none 와 마찬가지로 visibility:hidden도 요소를 숨길 수 있다. visibility : hidden을 사용하면 요소를 숨길 수있었습니다!
넷으로 조사해 보았지만, 이유는 모른다…

display:none과 visibility:hidden의 차이

위에서 언급했듯이 외형상에서는 모두 요소를 숨기고 있다. 그래서 클릭은 둘 다 할 수 없다. (클릭하려면 opacity:0 사용)

visibility:hidden: 요소를 숨깁니다. 따라서 자손 요소를 표시할 수 있다.
display:none: 요소별로 지웁니다(레이아웃이 변경될 수 있음). 그래서 자손 요소의 표시는 할 수 없다.



부모 요소만 숨기고 싶은 경우에는 visibility:hidden 를 사용한다.

참고문헌

htps : // bg. 케이스케 11. 코 m / ぇ b로 しg ん / ぢ sp ぁ y의 네 ゔ
htps //w w. 이로하보오 k. 이 m / ぢ sp ぁ y-