머리글/바닥 글이 고정 된 상태에서 스크롤되는 내용

콘텐츠가 스크롤되는 동안 머리글/바닥 글이 화면의 상단/하단에 고정 된 상태로 유지되는 웹 사이트가 있습니다. 나는이 효과를 얻는 방법을 설명하는 this question을 따라왔다. 어떤 종류의 작품인가? 내용을 아래로 스크롤하면 내용의 배경 이미지가 잘리는 것을 알 수 있습니다. 배경 이미지를 repeat-y으로 설정했기 때문에 이것이 왜 발생하는지 혼란 스럽습니다. 나는 또한 꼬리말이 내용의 일부를 숨기고있는 것으로 나타났습니다.머리글/바닥 글이 고정 된 상태에서 스크롤되는 내용

이 콘텐츠 전용 스크롤 효과를 얻으려면 머리말/꼬리말에 position: fixed;을 추가했습니다. 바닥 글이 화면 하단에 고정되도록 position: absolute;의 콘텐츠를 남겼습니다.

- 바닥 글에>Link to website

출처

2012-05-09 Jon

콘텐츠 배경을 옮기지 않는 한, 배경 : url (../ img/body.png) 160px 0 fixed : ' – rjz

내 화면에 꼬리말이 있습니다. 화면 하단에서 약 30px 떨어져 있습니다. – JakeParis

콘텐츠 배경을 옮기고 싶었습니다. – Jon

첫째, 추가 bottom: 0. 그러면 바닥에 닿을 것입니다.
이제 position: absolute을 #content에서 삭제하십시오.
마지막으로 #content의 위쪽과 아래쪽에 여분의 패딩을 추가하면 텍스트가 머리글/바닥 글 뒤에 숨겨지지 않습니다.

방화범 소리가 들리면 사이트의 문제를 해결할 수 있다고 알려줍니다. Ask him yourself.

출처

2012-05-09 18:41:02 JakeParis

'height : 250px'와 같은 뜻입니까? 문제는 모든 페이지의 콘텐츠 높이를 알 수 없다는 것입니다. – Jon

그래,이 경우 편집을 확인하십시오. – JakeParis

일종의 일했습니다. 페이지의 내용을 단 몇 줄로 줄이면 배경 이미지가 꼬리말까지 줄지 않습니다. – Jon

머리글/바닥 글이 고정 된 상태에서 스크롤되는 내용

답변

관련 문제