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
반응형
'~2023' 카테고리의 다른 글
[Server] Ubuntu 20.04에서 Spring Boot 배포하기 (3) - Apache2 Reverse Proxy (0) | 2021.06.11 |
---|---|
[JS] 스크롤 내리면 나타나는 navBar(메뉴바) 구현 (0) | 2021.06.10 |
[Server] Ubuntu 20.04에서 Spring Boot 배포하기 (2) - Tomcat9 (0) | 2021.06.10 |
[Server] Ubuntu 20.04에서 Spring Boot 배포하기 (1) - Setup (0) | 2021.06.07 |
[vim] vi, vim 전체 선택, 전체 복사, 전체 삭제 (0) | 2021.05.30 |