HTML 5/CSS 백분율 높이 팁
P粉135292805
P粉135292805 2023-08-20 19:15:25
0
2
525

CSS에서

를 특정 비율의 높이로 설정하려고 하는데 여전히 그 안에 있는 콘텐츠와 크기가 같습니다. 그러나 HTML 5의 을 제거하면 제대로 작동하고
가 예상대로 전체 페이지를 차지합니다. 페이지가 인증을 통과하길 원합니다. 어떻게 해야 합니까?

이 CSS는

에 있고 ID는 page입니다.

#페이지 { 패딩: 10px; 배경색: 흰색; 높이: 90% !중요; }
P粉135292805
P粉135292805

모든 응답 (2)
P粉759451255

또한요소의 높이를 설정해야 합니다. 그렇지 않으면 콘텐츠에 맞을 만큼만 커집니다.예를 들어:

으아악
    P粉530519234

    백분율이란 무엇인가요?

    백분율 높이를 설정하려면 상위 요소(*)에 명시적인 높이가 있어야 합니다. 이것은 상당히 명백합니다. 높이를auto로 두면 블록이 콘텐츠의 높이를 차지하게 됩니다... 그러나 콘텐츠 자체의 높이가 상위 요소의 백분율로 표현되면 약간의 차이가 있습니다. 양도 논법. 브라우저는 포기하고 콘텐츠 높이만 사용합니다.

    따라서 div의 상위 요소에는 명시적인height속성이 있어야 합니다. 원하는 경우 높이는 백분율로 표시될 수 있지만 이는 문제를 다음 단계로 끌어올릴 뿐입니다.

    div의 높이를 뷰포트 높이의 백분율로 만들려는 경우,都必须具有height: 100%를 포함한 div의 모든 상위 요소가 있으므로 div에 대한 명시적인 백분율 높이 체인이 있습니다.

    (*: 또는 div가 배치된 경우 "포함 블록", 역시 배치된 가장 가까운 조상 요소입니다.)

    또는 모든 최신 브라우저와 IE >= 9는 뷰포트 높이를 기준으로 새로운 CSS 단위를 지원합니다(vh)和视口宽度(vw):

    으아아아

    여기에서자세한 내용을 확인하세요.

      최신 다운로드
      더>
      웹 효과
      웹사이트 소스 코드
      웹사이트 자료
      프론트엔드 템플릿
      회사 소개 부인 성명 Sitemap
      PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!