HTML&CSS

HTML DIV 태그 position

인생아 2016. 3. 17. 12:49
반응형

DIV를 중첩 & 겹치기 위해선 position을 사용해야함


.test{ width:100px;

         height:100px;

         position:속성;}  //요런식으로...


속성에는 4가지 종류가 있다

- static : 기본 배치 / 브라우저의 흐름에 따라 알아서 배치한다.

- relative : 상/하위 관계가 형성

                .test li {position:relative;}
                .test li .aaa {position:absolute; top:-10px; left:10px;}

- fixed : 브라우저 전체를 기준(쉽게 브라우저 좌측 상단)으로 top,left,bottom,right 로 밀어준다.

            (스크롤 돌려도 그자리에 있음-위젯?? 만들 때 쓰면 될듯)

 

- absolute : 상위 DIV를 기준으로 top,left,bottom,right 로 밀어준다.

반응형