한 페이지에 화면 크기의 블록이 있습니다.

한 페이지에서 작업하고 있습니다. 다음 레이아웃이 있습니다.한 페이지에 화면 크기의 블록이 있습니다.

다음은 구조입니다. 헤더 높이 -

enter image description here

나는 모든 블록이 화면의 최소 높이를해야합니다.

blockHeight = screenHeight - headerHeight

현재이 문제를 해결하기 위해 jQuery를 사용하고 있습니다.

CSS3 만 사용하면됩니다.

출처

2014-09-16 yoko

'최소 높이 : calc (100vh - headerHeight);'. ['calc()'] (https://developer.mozilla.org/en-US/docs/Web/CSS/calc)를 사용하십시오. –

헤더에 고정 높이를 설정 한 다음 [viewports] (http://www.w3.org/TR/css3-values/#viewport-relative-lengths) 또는 [calc] (http : /css-tricks.com/a-couple-of-use-cases-for-calc/) – Hevlastka

당신은 여기 calc()

min-height: calc(100vh - 60px);

100vh = 뷰포트의 높이

60 픽셀 = 헤더 높이를 사용하여이 작업을 수행 할 수 있습니다.

출처

2014-09-16 10:19:45 Tushar

한 페이지에 화면 크기의 블록이 있습니다.

답변

관련 문제