CSS3 - 가시 속성

가시 속성은 태그가 화면에 보이는 방식을 지정하는 속성이다. 기본 속성은 display이며 아래의 키워드를 입력해 사용한다.

키워드	설명
none	태그를 화면에 보이지 않게 한다.
block	태그를 block 형식으로 지정 한다.
inline	태그를 inline 형식으로 지정 한다.
inline-block	태그를 inline-block 형식으로 지정 한다.

Display 속성.html

0.00MB

이전 태그부분에서 div 태그는 block 형식을 span 태그는 inline 형식을 가진다는 것을 기억하고 위의 예시를 보는 것이 도움이 된다.

 

아래는 visibility속성이며 아래의 대표적인 키워드를 입력해 사용한다.

키워드	설명
visible	태그를 보이게 한다.(기본값)
hidden	태그를 보이지 않게 한다.
collapse	table 태그를 보이지 않게 한다.

Visibility 속성.html

0.00MB

table 태그를 보이지 않게 하는 키워드는 collapse지만 hidden도 사용가능하다 둘의 차이점은 collapse는 table 태그가 차지하는 영역 자체가 사라지지만, hidden은 table 태그가 차지하는 영역은 남기고 사라지게 만든다.

 

opacity 속성은 태그의 투명도를 조절하는 스타일 속성이다. opacity는 0.0부터 1.0까지 조절가능하고 0.0은 가장 투명한 상태고 1.0은 가장 불투명한 상태이다.

Opacity 속성.html

0.00MB