background-attachment
요소가 스크롤될 때 배경 이미지의 스크롤 여부 설정.
scroll 배경 이미지가 요소를 따라서 같이 스크롤됨 (기본값)
fixed 배경 이미지가 뷰포트에 고정되어, 요소와 같이 스크롤되지 않음.
local 요소 내 스크롤 시 배경 이미지가 같이 스크롤 됨
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body{
height: 3000px;
}
.box{
width: 90%;
height: 700px;
margin: 200px auto 0;
background: url('../img/sky.jpg') no-repeat fixed center/ cover;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>
'CSS입문' 카테고리의 다른 글
| CSS_박스 띄우기_단순띄우기(float)_22.04.11(mon) (0) | 2022.04.11 |
|---|---|
| CSS_background(img연습문제)_22.04.11(mon) (0) | 2022.04.11 |
| CSS_background(size)_22.04.11(mon) (0) | 2022.04.11 |
| CSS_background_22.04.11(mon) (0) | 2022.04.11 |
| CSS_font(family)_22.04.11(mon) (0) | 2022.04.11 |