레이어4 [CSS] 레이어의 기본 위치 설정 CSS의 position 속성을 이용하면 레이어의 위치 설정이 가능하다. position 속성의 값은 4가지 중 하나를 설정할 수 있다. static : 기본값으로 HTML문서의 일반적인 내용물의 흐름을 말한다. top, left 지정이 가능하다. absolute : 자신의 상위 레이어 안에서 top, left, right, bottom 등의 절대적인 위치를 지정할 수 있다. relative : HTML 문서 안에서의 일반적인 흐름을 말한다. top, left 지정이 가능하다. fixed : scroll이 일어나도 항상 지정된 위치에 있는다. IE6에서는 적용되지 않는다. 2014. 3. 10. [CSS] 레이어 속성 레이어는 HTML상에서 기존의 요소와는 독립적으로 원하는 위치에 글이나 그림을 위치 시킬 수 있도록 해준다. 태그의 position 속성값을 absolute 로 설정을 하면 해당 태그를 레이어로서 사용이 가능하다. 속성 설명 left 브라우저 좌측경계로부터의 거리 top 브라우저 상단경계로부터의 거리 width 레이어의 폭 height 레이어의 높이 background-color 레이어의 배경색을 설정한다. 색이름이나 RGB색상코드가 가능하다. background-image 레이어의 배경이미지를 설정한다. #이름{position:absolute; background-image:url(back.gif);} visibility 레이어를 보여줄 것인지 또는 감출 것인지를 설정한다. hidden : 레이어를 감.. 2014. 3. 9. [CSS] 레이어 정렬속성 HTML 문서상의 레이어는 float, clear 속성을 통해서 정렬할 수 있다. float : 레이어를 현재의 위치에서 좌측 또는 우측에 배치한다. 선택자 { float: 위치} none : 기본값 left : 현재 엘리먼트를 좌측에 배치하고 다음에 오는 요소를 우측에 배치 right : 현재 엘리먼트를 우측에 배치하고 다음에 오는 요소를 좌측에 배치 clear : float 속성이 사용된 엘리먼트의 정렬값을 다음 요소에 영향을 주지 않도록 한다. 선택자 { clear: 해제방향 } none : 기본값 left : float속성값이 left로 적용된 경우에 이를 해제 right : float속성갑싱 right로 적용된 경우에 이를 해제 both : float속성값 모두 해제 2014. 3. 8. [CSS] 페이지 디자인을 브라우저 화면 중간에 위치 시키기 #content { width: 700px; position: relative; left: 50%; margin-left: -360px; } content 의 좌측 끝을 페이지 중간에 놓기 위해서는 left:50% 을 한 후에, 좌측 마진에 마이너스 값 (margin-left:-350px;)을 줌으로써 가능하다. 2014. 2. 25. 이전 1 다음