CSS 80% JS 20%

[daybrush]

• 비중이 CSS가 80%이고 JS 20%인 CSS 스터디입니다.
• CSS의 변화가 JS에 어떤 영향을 끼치는가? 정도의 JS가 포함되어있습니다.
• 평상시 CSS 사용하면서 알고 있는 것과 입사하고 InfiniteGrid를 만들면서 알게 된 것과 CSS 관련 질문받으면서 새로 알게 된 것들을 공유하는 스터디입니다.

1. position
   • static
   • relative
   • absolute
   • fixed
   • sticky
2. doctype과 변화
   • height: 100%;
   • scrollTop
   • clientSize, offsetSize
3. boder
4. border, padding, margin, box-sizing
   • cssSize, clientSize, offsetSize, getBoundingClientRect
5. padding: %
6. display (inline, inline-block, block)과 float
   • inline
   • inline-block
   • block
   • inline-block과 float의 차이
   • inline-block과 font-size 조합
7. float:left와 overflow, clear의 조합
8. white-space와 display: inline의 조합
9. transform, transform-origin
10. 수직 정렬
    • transform
    • vertical-align: middle;
    • button
    • margin: auto;
    • left와 margin의 조합
    • flex
11. clip
12. overflow
13. z-index
14. transition과 will-change
15. force layout과 requestAnimFrame
16. border를 이용한 도형 만들기
17. border-radius를 이용한 원, 타원 만들기
    • horizontal / vertical

---

18. box-shadow
    19 appearance
19. 실습 여러가지