과제리뷰_1만 시간의 법칙

11월 11일
📍어제의 수업 과제 였던 1만시간의 법칙 리뷰

1만시간의 법칙

1. 폰트

이번에 했던 1만시간의 법칙은 총 4개의 폰트가 필요했다.

• 일반적으로 300kb를 넘으면 크다고 생각한다.
• 폰트는 보통 2개정도 사용한다.
• 이미지 텍스트로 표현하면 용량이 많이 줄어 들 수 있다.

위의 파일을 살펴보면, 아래 폰트를 찾아 볼 수 있다.

해당 폰트는 저 문구에만 사용될 뿐, 다른 곳에서 활용되지 않는다.
그렇기 때문에 이미지처리 해서 폰트를 이용하지않고, 용량을 낮출 수 있다.

---

2. z-index

쌓이는 순서를 정할 수 있다.

• 그림이 겹쳐지면서 비추는 경우
• 원하는 순서가 있는 경우

등에서 z-index를 사용하게 된다.
📌 z-index로 바뀌는 레이아웃은 마크업에 영향을 끼치진 않는다.

<값>
보통 1,2,3의 순서로 주게 된다.
값이 클수록 위로 오게 된다.
나중에 값이 많아지면 복잡할 수 있으니, 10단위로 쓰는 것을 추천한다.

.tit-law .img-tit {
    position: relative;
    z-index: 10;
}

💡 position 값이 있어야 사용할 수 있다.

---

3. 가상요소

별 다른 의미를 가지고 있지 않는 요소는 가상요소로 작성해준다.
위의 파일에서는 click손가락 같은 경우 이다.

버튼도 아니고, 클릭을 하라고 꾸미는 요소기 때문에 가사 요소로 작성한다.

• 가상요소는 display와 content를 꼭 넣어준다.
• 이때 content는 문자나 url등이 올 수 있다.
  (하지만, img의 url인 경우는 img를 조절하기 어려워서 사용하지 않는다.)

---

아무래도 1만시간의 법칙은 마크업할 것들 보다는 시각적 요소들이 많기 때문에 이런 부분들이 중요했던거 같다.
여러가지를 연습해볼 요량으로 practice 폴더를 만들었다.
여러가지로 css를 연습해 봐야겠다.