코딩 공부/HTML
<7> 배경
hg_96
2021. 3. 9. 17:28
background-clip :
border-box - 박스 모델의 가장 외곽
padding-box - 박스 모델의 테두리를 뺀 범위
content-box - 박스 모델의 내용 부분
background-repeat :
repeat - 화면 끝까지 이미지를 가로, 세로 반복 배치
repeat-x - 화면 끝까지 이미지를 가로로 반복
repeat-y - 화면 끝까지 이미지를 세로로 반복
no-repeat - 이미지를 한 번만
background-size :
auto - 원래 배경 이미지만큼
contain - 요소 안에 맞춤
cover - 요소를 덮도록 맞춤
크기 값, 백분율 - 가로와 세로를 지정
background-origin :
border-box - 가장 외곽의 테두리
padding-box - 테두리를 뺀 안쪽 테두리
content-box - 내용의 부분이 기준