div 태그공부-6 속성 값과 의미

div태그 강좌 마지막 시간입니다

 

알아두면 좋을 태그 속성과 그 의미들입니다.

표로 그리려고 했는데 넘 불편해서^^

 

id

레이어의 고유한 이름

 

position

absolut : 브라우저의 좌측 상단을 기준으로 지정한 거리만큼 떨어진 곳에

레이어가 놓입니다.(절대 좌표)

relative : 상위 태그의 오른쪽 상단 위치를 기준으로 지정한 거리만큼 떨어진

곳에 레이어가 놓입니다.(상대좌표)

 

top

X좌표(단위를 생략하면 픽셀로 인식)

 

left

  Y좌표(단위를 생략하면 픽셀로 인식)

 

width

너비를 지정합니다.(단위를 생략하면 픽셀로 인식)

 

height

높이를 겹칠 경우, 값이 큰 개체가 더 앞쪽에 위치하게 됩니다.

 

z-index

개체들이 겹칠 경우, 값이 큰 개체가 더 앞쪽에 위치하게 됩니다.

 

overflow

개체들이 겹칠 경우, 값이 큰 개체가 더 앞쪽에 위치하게 됩니다.

scroll : 가로/세로 스크롤바를 만듭니다.

hidden : 넘치는 영역을 표시하지 않습니다.

visible : 넘치는 영역만큼 width와 height를 늘려줍니다.

auto : 브라우저가 알아서 스크롤바를 만듭니다.

 

visibility

내용의 출력 여부를 결정하는 속성으로 자바스크립트 등에서 그림이 사라졌다

나타났다를 반복할 때 이 속성을 이용할 수 있습니다.

hidden : 내용을 출력하지 않습니다.

visible : 내용을 출력합니다.

inherit : 레이어 속에 레이어가 있을 경우 부모 레이어의 속성을 상속받습니다.

 

background-color

레이어의 배경색을 지정합니다.