위치 지정에 CSS를 사용하는 방법은 무엇입니까? CSS 레이아웃 및 위치 지정에 대한 자세한 설명

위치 지정에 CSS를 사용하는 방법 CSS는 HTML 요소의 위치를 ​​지정하는 데 도움이 됩니다. 원하는 곳에 HTML 요소를 배치할 수 있습니다. 페이지의 자연스러운 위치를 기준으로 요소의 위치를 ​​지정할지, 아니면 상위 요소 정의를 기반으로 할지 지정할 수 있습니다. 아래에서 CSS 레이아웃 및 위치 지정을 설명하겠습니다.

하나: 상대 위치 지정

상대 위치 지정은 HTML 요소를 정상 위치에 맞춰 변경합니다. 표시 위치의 위치입니다. left:20은 요소의 왼쪽 위치에 20픽셀을 추가합니다. [추천도서 : 상대위치, 절대위치, 고정위치에 대한 자세한 설명】

상단값과 왼쪽값을 사용하시면 됩니다 ​​​​및 위치 속성은 HTML 요소를 HTML 문서의 원하는 위치로 이동합니다.

왼쪽으로 이동 - 왼쪽에는 음수 값을 사용합니다.

오른쪽으로 이동 - 왼쪽의 양수 값을 사용합니다.

위로 이동 - 상단에 음수 값을 사용합니다.

아래로 이동 - 위쪽에는 양수 값을 사용합니다.

참고 - 위쪽 및 왼쪽과 동일한 방법으로 아래쪽 또는 오른쪽 값을 사용할 수도 있습니다.

2: 절대 위치 지정

position: 절대 요소는 왼쪽 위 모서리를 기준으로 지정된 좌표에 위치합니다. 화면.

top과 left라는 두 값과 위치 속성을 사용하여 HTML 문서의 어떤 위치로든 HTML 요소를 이동할 수 있습니다.

왼쪽으로 이동 - 왼쪽에는 음수 값을 사용합니다.

오른쪽으로 이동 - 왼쪽의 양수 값을 사용합니다.

위로 이동 - 상단에 음수 값을 사용합니다.

아래로 이동 - 위쪽에는 양수 값을 사용합니다.

참고 - 아래쪽 또는 오른쪽 값도 위쪽 및 왼쪽과 동일한 방식으로 사용할 수 있습니다.

Three: 고정 위치 지정

고정 위치 지정을 사용하면 페이지의 특정 위치에 요소의 위치를 ​​고정할 수 있습니다. 스크롤과 상관없이요. 지정된 좌표는 브라우저 창을 기준으로 합니다.

top과 left라는 두 값과 위치 속성을 사용하여 HTML 요소를 HTML 문서의 원하는 위치로 이동할 수 있습니다.

왼쪽으로 이동 - 왼쪽에는 음수 값을 사용합니다.

오른쪽으로 이동 - 왼쪽의 양수 값을 사용합니다.

위로 이동 - 상단에 음수 값을 사용합니다.

아래로 이동 - 위쪽에는 양수 값을 사용합니다.

참고 - 위쪽 및 왼쪽과 동일한 방식으로 아래쪽 또는 오른쪽 값을 사용할 수도 있습니다.

위는 위치 지정에 CSS를 사용하는 방법입니다. CSS 레이아웃 및 위치 지정에 대한 전체 설명 CSS 튜토리얼에 대해 더 알고 싶다면 PHP 중국어 웹사이트를 주목하세요.

위 내용은 위치 지정에 CSS를 사용하는 방법은 무엇입니까? CSS 레이아웃 및 위치 지정에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!