명시적인 위쪽, 왼쪽, 아래쪽 또는 오른쪽 속성을 지정하지 않고 절대 위치 지정을 어떻게 달성할 수 있습니까?

명시적인 위쪽/왼쪽/아래/오른쪽 없이 절대 위치 지정

어떤 경우에는 요소를 명시적으로 지정하지 않고 요소를 절대적으로 배치해야 하는 경우가 있을 수 있습니다. 상단, 왼쪽, 하단 또는 오른쪽 속성을 명시적으로 설정합니다. 두 가지 사례가 이 개념을 보여줍니다.

사례 #1: 헤더의 사진 위에 로고

첫 번째 예의 목표는 헤더의 사진 위에 로고를 배치하는 것입니다. 기본 WordPress 테마의 헤더입니다. 사진 앞에 로고를 추가하고 공간 속성을 지정하지 않고 위치를 절대값으로 설정하면 로고가 해당 컨테이너를 기준으로 자동으로 배치됩니다. 이는 CSS2 사양에 설명된 기본 동작으로 인해 가능합니다. 이 동작은 절대 위치 지정 요소에 대해 설정되지 않은 경우 이러한 속성에 자동 값을 할당합니다.

사례 #2: 수평 다단계 메뉴

두 번째 예는 전체 너비에 걸쳐 있고 디스플레이: table-*를 사용하여 레이아웃되는 수평 다단계 메뉴를 만드는 것입니다. 테이블 셀은 position:relative를 지원하지 않으므로 해결책은 공간 속성을 설정하지 않고 절대 위치 지정을 사용하는 것입니다. 그러나 이 접근 방식은 모든 브라우저 및 장치 유형에서 일관되지 않을 수 있으므로 해결 방법으로 고려해야 합니다.

자동 값의 표준 동작

CSS2 사양에 따름 , 위쪽/아래쪽 및 왼쪽/오른쪽 속성이 자동으로 설정된 경우 위치 지정되지 않은 상태의 요소 위치가 기본값으로 설정됩니다. 이 동작을 통해 명시적인 공간 좌표가 필요 없이 요소의 자연스러운 흐름을 기준으로 절대적 위치를 지정할 수 있습니다.

위 내용은 명시적인 위쪽, 왼쪽, 아래쪽 또는 오른쪽 속성을 지정하지 않고 절대 위치 지정을 어떻게 달성할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!