position:absolute margin: 0 auto;

1645 단어
div 가운데 맞춤, width 설정
    margin: 0 auto;
    width: 1000px;

position: absolute 상급 (최근) 에서position의div를 설정합니다
CSS2.0 HandBook의 설명: 이 속성 값을 absolute로 설정하면 객체가 주변 컨텐트의 레이아웃을 고려하지 않고 정상적인 문서 흐름에서 절대적으로 위치하도록 드래그됩니다.만약 다른 z-index 속성을 가진 대상이 이미 주어진 위치를 차지한다면 그들 사이는 서로 영향을 주지 않고 같은 위치에서 겹칠 것이다.
TRBL 속성(TOP, RIGHT, BOTTOM, LEFT)을 설정하면position:absolute가 부모(무한)position 속성을 설정하지 않으면 현재의 absolute는 TRBL 속성과 결합하여 브라우저의 왼쪽 상단을 원시점으로 하고 부모(무한)position 속성을 설정하면 현재의 absolute는 TRBL 속성과 결합하여 부모(최근)의 왼쪽 상단을 원시점으로 한다.position:relative를 설정하면 부모 레벨(최근)의 컨텐츠 영역의 왼쪽 상단을 참조하여 TRBL 속성과 함께 위치를 지정합니다(또는 부모 레벨의 컨텐츠 영역에 있는 이전 요소와 비교하여 간격띄우기). 부모 레벨이 없으면 BODY의 왼쪽 상단을 원시점으로 합니다.상대적인 포지셔닝은 겹칠 수 없다.상대적인 포지셔닝을 사용할 때 원소가 이동하든 안 하든 원소는 원래의 공간을 차지한다.따라서 요소를 이동하면 다른 상자를 덮어씁니다.일반적으로 웹 페이지가 가운데에 있으면 Absolute를 사용하면 오류가 발생하기 쉽다. 웹 페이지는 해상도 크기에 따라 자동으로 적응되고 Absolute는 브라우저의 왼쪽 상단을 원시점으로 하여 해상도 변화에 따라 위치를 바꾸지 않기 때문이다.때로는 z-index에 의존하여 용기의 상하 관계를 설정해야 한다. 수치가 클수록 맨 위에 있고 수치 범위는 자연수다.물론 주의해야 할 것은 부자관계는 z-index로 상하관계를 설정할 수 없으며 틀림없이 자급이 상부급에서 하급일 것이다.이 속성 값을 relative로 설정하면 일반적인 HTML 흐름에서 객체가 유지되지만 이전 객체에 따라 위치가 오프셋됩니다.상대적(relative) 포지셔닝 대상 이후의 텍스트나 대상은 자신들의 공간을 차지하고 포지셔닝 대상의 자연 공간을 덮어쓰지 않는다.이와 달리 절대 (absolute) 포지셔닝 대상 이후의 텍스트나 대상은 포지셔닝 대상이 정상적인 문서 흐름에서 끌리기 전에 자연 공간을 차지한다.절대 (absolute) 포지셔닝 대상을 가시 영역 밖에 두면 스크롤 바가 나타납니다.반면에 상대적(relative) 포지셔닝 대상을 가시 영역 밖에 두면 스크롤 바가 나타나지 않는다.사실 포지셔닝에 대한 주요 문제는 모든 포지셔닝의 의미를 기억하는 것이다.상대적 포지셔닝은'원소가 문서 흐름에서 처음 위치하는 것과 같고 절대적 포지셔닝은'최근에 포지셔닝된 조상 원소와 같다'는 것이다.

좋은 웹페이지 즐겨찾기