> 웹 프론트엔드 > CSS 튜토리얼 > 동적 페이지 콘텐츠의 맨 아래에 Div를 고정하는 방법은 무엇입니까?

동적 페이지 콘텐츠의 맨 아래에 Div를 고정하는 방법은 무엇입니까?

Susan Sarandon
풀어 주다: 2024-12-13 00:47:10
원래의
808명이 탐색했습니다.

How to Anchor a Div to the Bottom of Dynamic Page Content?

동적 콘텐츠가 포함된 페이지 콘텐츠 하단에 Div 고정

문제:

div를 만들어야 합니다. (#footer)는 스크롤바가 erscheinen인 경우에도 페이지 콘텐츠 하단에 남아 있습니다. 고정 위치 지정과 달리 뷰포트가 아닌 실제 콘텐츠의 끝 부분에만 위치해야 합니다.

현재 구현:

#footer {
    position: absolute;
    bottom: 30px;
    width: 100%;
}
로그인 후 복사

이 방법은 div 위치를 지정합니다. 뷰포트 하단에 있지만 페이지를 스크롤해도 고정된 상태로 유지되어 content.

해결책: 하단 조정으로 위치 고정

#footer {
    position: fixed;
    bottom: 0;
    width: 100%;
}
로그인 후 복사

위치를 고정으로 설정하면 div가 브라우저 창 하단에 안클라도됩니다. 하단 속성을 사용하면 스크롤 막대 표시 여부에 관계없이 div가 페이지의 절대 베이스에 배치됩니다.

이 위치 지정을 사용하면 예시에 설명된 것처럼 div가 콘텐츠 하단에 정렬된 상태를 유지할 수 있습니다.

위 내용은 동적 페이지 콘텐츠의 맨 아래에 Div를 고정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿