하나솔루션
Home > 고객센터 > 자료실

자료실

자료실

div 영역 숨기기 할때..visibility 와 display 의 차이

  • 하나솔루션
  • 2020-07-17 16:47:28
  • hit1308
  • 1.245.146.49

div 영역 숨기기 시에..

style="display:none"  과 visibilit:hidden 의 차이를 알아 볼 것.. 화면에서 그려지는것이 약간 틀린것을 발견함..

웹 검색 결과 이런 내용이 떠서 펌..

 

CSS 속성 중 visibility:hidden 과 display:none 의 속성은 태그를 숨길 때 사용한다.

태그를 숨기는 속성은 같지만 태그가 위치하는 공간은 틀려진다

display:none 은 여백을 남기지 않고 숨겨지지만, visibility:hidden의 경우에는 여백을 남긴 채 숨겨지게 된다.

 

<p><strong>Normal</strong></p>
<div style="border:5px #FF0000 solid;">DIV01</div>
<div style="border:5px #33FF66 solid;">DIV02</div>
<div style="border:5px #3366FF solid;">DIV03</div>

<p><strong>Display none</strong></p>
<div style="border:5px #FF0000 solid;">DIV01</div>
<div style="border:5px #33FF66 solid;display:none;">DIV02</div>
<div style="border:5px #3366FF solid;">DIV03</div>

<p><strong>Visibility hidden</strong></p>
<div style="border:5px #FF0000 solid;">DIV01</div>
<div style="border:5px #33FF66 solid;visibility:hidden;">DIV02</div>
<div style="border:5px #3366FF solid;">DIV03</div>

 

 
게시글 공유 URL복사
댓글[0]

열기 닫기

CUSTOMER CENTER

010-2343-0702

월-금 am 9:30 - pm 06:00
점심시간 : am 12:00 - pm 01:00
토ㆍ일 / 공휴일 휴무

무통장 입금계좌 안내

661-910388-38207

네임서버안내

1차 ns1.webit.kr
211.215.17.210
2차 ns2.webit.kr
211.215.17.212