본문 바로가기

~2023

[CSS] 단락 높이를 화면에 꽉 맞게 지정하기

728x90
반응형

보통 화면에 꽉 맞는 높이를 지정하기 위해서는 100%를 자주 쓴다.

하지만 기괴하게도 100%로 선언하면 내가 원하는대로 안 되는 경우가 많다.

그렇다고 px 값을 지정해서 준다면 화면 크기가 바뀌었을 때 스크롤만 무한히 내려갈 것이다.

그러면 어떻게 %가 아닌 고정값으로 화면에 맞게 높이를 지정하는가?

아래 코드를 사용하면 쉽게 구현할 수 있다.

/* 배경 이미지 */
body {
	height: 100vh;
    background-image: url('path');
    background-repeat: no-repeat;
    background-size: cover;
}


/* 단락 */
div {
	width: 100%;
	height: 100vh;
}

heigth에 100vh를 지정해주면 된다.

 

 

 

 

 

 
 
 
728x90
반응형