다시 쓴 제목은 div 및 위치 지정 요소의 구현 방법입니다.

Question

이런 것을 재현하려고 하는데 이제 몇 가지 문제가 발생합니다. 제가 겪었던 첫 번째 문제는 '메인' div를 중앙에 두는 것이었습니다. 저는 다음과 같이 했습니다:

으아아아

근데 '위치 고정'으로 인해 배경이 더 이상 표시되지 않고 본문에 배경을 추가했습니다.

또 다른 문제는 제가 다시 만들려는 웹사이트에 두 개의 p 요소가 나란히 있지만 다음 코드를 사용하여 두 개의 p 요소를 합칠 수 없다는 것입니다.

으아아아

이것은 내 p 요소와 전체 HTML의 모습입니다:

으으으으

Answer 1

주 콘텐츠를 절대적으로 배치하는 대신 body 요소에 display: flex를 적용하고 100vh로 설정하여 뷰포트를 덮을 수 있습니다. 그러면 배경이 다시 나타납니다.

p 요소의 경우 마찬가지로 div를 display: flex로 감싸서 아래 예처럼 나란히 배치하세요.

으아악 으아악

Answer 2

당신의 생각을 이해합니다만, 불행히도 그것이 완전히 정확하지는 않습니다. 아시다시피, 초기 페이지의 디자인은 처음과 완전히 다릅니다:

제작자는 메인 div를 중앙에 두지 않고 64px，然后将wrapper div的宽度设为100%，高度设为100% - 64px * 2 본문에 패딩을 추가했습니다. 따라서 이렇게 하려면:

으아악 으아악