웹 페이지 하단에 바닥글을 수정하는 방법은 무엇입니까?

페이지 하단에 바닥글을 고정하는 방법

많은 웹사이트에서 바닥글이 하단에 고정되지 않는 문제가 발생합니다. 특히 콘텐츠 양이 적은 페이지에서는 더욱 그렇습니다. 화면 크기나 콘텐츠 길이에 관계없이 바닥글이 페이지 하단에 유지되도록 하려면 다음 CSS 솔루션을 사용하세요.

#footer {<pre class="brush:php;toolbar:false">position: fixed;
height: 50px;
background-color: red;
bottom: 0px;
left: 0px;
right: 0px;
margin-bottom: 0px;

}

이 코드는 다음 속성을 바닥글:

• 위치: 바닥글의 위치를 ​​고정으로 설정하여 페이지의 스크롤 위치에 관계없이 제자리에 유지되도록 합니다.
• 높이: 높이를 지정합니다. footer.
• background-color: 데모용으로 바닥글의 배경색을 조정합니다.
• bottom: 바닥글의 아래쪽 가장자리를 배치합니다. 페이지 하단에서 0픽셀.
• 왼쪽: 정렬 바닥글의 왼쪽 가장자리를 페이지의 왼쪽 가장자리에 맞춥니다.
• 오른쪽: 바닥글의 오른쪽 가장자리를 페이지의 오른쪽 가장자리에 맞춥니다.
• margin-bottom: 원하지 않는 아래쪽 여백을 제거합니다.

콘텐츠가 고정 바닥글과 겹치지 않으면 본문 요소에 추가 CSS 규칙을 적용할 수 있습니다:

body {<pre class="brush:php;toolbar:false">margin-bottom: 50px;

}

이렇게 하면 본문에 50픽셀 하단 여백이 추가되어 고정 바닥글을 위한 공간이 만들어집니다. 표시됩니다.

위 내용은 웹 페이지 하단에 바닥글을 수정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!