Position에는 "정적", "상대적", "절대", "고정" 및 "고정"의 5가지 용도가 있습니다. 1. 특별한 위치 지정이 없음을 의미하는 정적 기본값 2. 요소에 상대적임을 의미하는 상대 위치 지정; 문서 흐름에서의 위치 3. 절대 절대 위치 지정, 이는 가장 가까운 비정적 위치의 조상 요소 등을 기준으로 위치 지정을 의미합니다.
이 튜토리얼의 운영 체제: Windows 10 시스템, Dell G3 컴퓨터.
CSS에서 위치 속성은 다음과 같은 용도로 사용됩니다.
static: 기본값, 요소는 문서 흐름에 따라 정상적으로 정렬되며 특별한 위치 지정이 수행되지 않습니다.
relative: 상대 위치 지정, 요소는 문서 흐름의 일반 위치를 기준으로 위치가 지정됩니다. 상단, 오른쪽, 하단 및 왼쪽 속성을 사용하여 일반 위치를 기준으로 요소의 오프셋을 조정할 수 있습니다.
absolute: 절대 위치 지정, 요소는 가장 가까운 비정적 위치 지정 상위 요소를 기준으로 위치가 지정됩니다. 비정적으로 위치된 조상 요소가 없으면 문서의 초기 포함 블록을 기준으로 위치가 지정됩니다. 위쪽, 오른쪽, 아래쪽 및 왼쪽 특성을 사용하여 위치가 지정된 상위 요소를 기준으로 요소의 오프셋을 지정할 수 있습니다.
fixed: 고정 위치 지정, 요소는 브라우저 창을 기준으로 위치가 지정되고 페이지가 스크롤되더라도 고정 위치에 유지됩니다. 상단, 오른쪽, 하단 및 왼쪽 속성을 사용하여 브라우저 창을 기준으로 요소의 오프셋을 지정할 수 있습니다.
고정: 고정 위치 지정, 요소는 스크롤이 특정 임계값에 도달한 후 고정 위치가 될 때까지 스크롤 위치에 따라 문서 흐름에 배치됩니다. 위쪽, 오른쪽, 아래쪽 및 왼쪽 속성을 사용하여 위치가 지정된 상위 요소 또는 뷰포트를 기준으로 요소의 오프셋을 지정할 수 있습니다.
적절한 오프셋 속성과 결합된 이러한 위치 지정 방법을 사용하면 부동 효과 생성, 고정 탐색 표시줄, 절대 위치 팝업 상자 등과 같은 다양하고 복잡한 레이아웃 효과를 얻을 수 있습니다.
위 내용은 위치의 용도는 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!