CSS의 기본 레이아웃 및 형식 위치 소개

         다섯 가지 기본 레이아웃 위치 지정 유형: * 유연한 레이아웃 - 전체 너비와 그 안에 있는 모든 열의 값이 em 단위로 기록됩니다. 이렇게 하면 브라우저에 지정된 기본 글꼴 크기를 사용하여 레이아웃의 크기를 조정할 수 있습니다. 열 너비가 더 넓어져 모든 크기에서 줄 길이를 더 편안하고 읽을 수 있게 되므로 시력이 낮은 사용자에게 더 매력적이고 접근하기 쉽습니다. 전체 너비가 확장되므로 디자인에서는 이 너비를 허용해야 합니다. * 고정 레이아웃 - 전체 너비와 그 안에 있는 모든 열의 값이 픽셀 단위로 기록됩니다. 레이아웃은 사용자 브라우저 중앙에 위치합니다. * 유동 레이아웃 - 전체 너비와 그 안에 있는 모든 열의 값이 백분율로 기록됩니다. 백분율은 사용자의 브라우저 창 크기를 기준으로 계산됩니다. * 하이브리드 레이아웃 - 하이브리드 레이아웃은 탄력적 레이아웃과 유동적 레이아웃이라는 두 가지 다른 유형의 레이아웃을 결합합니다. 페이지의 전체 너비는 100%이지만, 사이드바 값은 em 단위로 설정되어 있습니다. * 절대 위치 레이아웃 - 앞서 언급한 레이아웃의 모든 외부 열은 플로팅 콘텐츠를 사용합니다. 절대 위치 레이아웃은 이름 그대로 절대 위치 외부 열을 사용하여 수행됩니다. 이러한 레이아웃을 사용할 때 사이드바가 "문서의 흐름을 높인다"는 점을 기억해야 합니다. 따라서 일부 부적절한 결과가 발생할 수 있습니다(예를 들어, 사이드바가 끝나고 기본 콘텐츠 영역 내에 포함되는 바닥글은 "보이지 않을" 수 있습니다). 사이드바보다 콘텐츠가 적은 페이지가 바닥글과 겹칩니다.)

첫 번째 위치 관계: position:fixed는 위치(전체 브라우저의 위치 기준)를 잠그는데, 이는 주요 웹사이트의 오른쪽 하단이나 기타 위치에 있는 작은 광고에서 흔히 사용됩니다.

잠금 위치를 조정해야 하는 경우 다음 방법을 사용해야 합니다:

position:fixed; top:0px; left :0px; 오른쪽:0px ; 하단:0px" >

두 번째 위치 관계: 위치:절대 절대 위치(상위 요소 기준 - 절대 위치 지정의 상위 요소)

(1) 가장 바깥쪽 절대값이 없으면 조정 중에 div가 브라우저를 기준으로 변경됩니다. (2) 가장 바깥쪽에 절대값이 있으면 조정 중에 div가 가장 바깥쪽 경계를 기준으로 변경됩니다.

절대 위치를 조정해야 하는 경우 다음 방법을 사용해야 합니다:

position:absolute; top:0px; left :0px; right:0px ; Bottom:0px" >

세 번째 위치 관계: 위치: 상대 상대 위치(표시되어야 하는 위치에 상대적)

조정이 필요한 경우 상대 위치인 경우 다음 방법을 사용해야 합니다: < ;div style="width:300px; height:300px; position:relative; top:0px; left:0px; right:0px; Bottom :0px" >