백그라운드 이미지

body {
background-image: url("");
/ 배경이미지 반복(repeat)중지 속성 /
background-repeat: no-repeat;
/ 배경 이미지 위치(좌표) 이동 : 양수(아래, 오른쪽) /
/ 사용법 : background-position: 오른쪽 아래; /
background-position: 500px 100px;
}

백그라운드 사이즈

/ 단위 : px(픽셀), %(비율),
vw/vh(뷰포트 단위) : pc / 핸드폰 모니터 크기 : 핸드폰 모니터 크기에 좌우되지 않고 비율로 적용되는 단위
vw(뷰포트 가로크기) wh(뷰포트 세로크기)
/

태그 사이에 우선 순위

• TODO: 태그사이에 우선순위 디자인 규칙 /
  / TODO 부모 태그 VS 자식 태그 : 자식 태그 디자인 우선 /
  / TODO:2) ID선택자 VS class선택자 : id 선택자가 디자인 우선 /
  / TODO:3) {속성: 값 !important;} 우선순위 무시 개발자 강제 적용 /
  / id > class > html 태그 > 전체 선택자 (우선 순위 등급) */
  

display 속성

/ TODO: div 태그 특징 : block 속성 (vs inline 속성)
1) 자동 줄바꿈
2) 가로/세로 크기 속성 적용
정리 : 1), 2) 특징을 가진 태그는 block 속성 성질을 가졌다
예 h1제목태그(o) (1번 2번 특징있음) , p태그(o)(본문태그 문단태그), img(x), b태그(x)
block 속성을 가지지 않은 태그 : inline 속성 /
.box {
width: 50px;
height: 50px;
background-color: blue;
margin: 5px;
/ TODO: display 속성 : 강제로 block <-> inline 변경하는 속성 /
display: inline;

• TODO: inline-block 속성
  1) 가로/세로 o
  2) 줄바꿈 x */