이런 것을 재현하려고 하는데 이제 몇 가지 문제가 발생합니다. 제가 겪었던 첫 번째 문제는 '메인' div를 중앙에 두는 것이었습니다. 저는 다음과 같이 했습니다:
으아아아근데 '위치 고정'으로 인해 배경이 더 이상 표시되지 않고 본문에 배경을 추가했습니다.
또 다른 문제는 제가 다시 만들려는 웹사이트에 두 개의 p 요소가 나란히 있지만 다음 코드를 사용하여 두 개의 p 요소를 합칠 수 없다는 것입니다.
으아아아이것은 내 p 요소와 전체 HTML의 모습입니다:
으으으으
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
주 콘텐츠를 절대적으로 배치하는 대신 body 요소에 display: flex를 적용하고 100vh로 설정하여 뷰포트를 덮을 수 있습니다. 그러면 배경이 다시 나타납니다.
p 요소의 경우 마찬가지로 div를 display: flex로 감싸서 아래 예처럼 나란히 배치하세요.
당신의 생각을 이해합니다만, 불행히도 그것이 완전히 정확하지는 않습니다. 아시다시피, 초기 페이지의 디자인은 처음과 완전히 다릅니다:
제작자는 메인 div를 중앙에 두지 않고
64px，然后将wrapper div的宽度设为100%，高度设为100% - 64px * 2본문에 패딩을 추가했습니다. 따라서 이렇게 하려면: