스터디 정보

• 시나몬

환경 세팅

• 크롬 설치: https://www.google.com/intl/ko/chrome/
• vscode 설치: https://code.visualstudio.com
• vscode 확장 프로그램 live-server 설치: 설치 방법

회차별 자료

1, 2회차 자료

• PPT 링크
• html/css 코드 다운로드

1, 2회차 과제

• 코드 다운로드: 편의성을 위해 파일 하나에 css와 html을 다 넣어두었습니다.

3회차 자료

• PPT 링크
• html/css 코드 다운로드 : 수정 전 샘플과 수업 진행 후 수정 완료된 샘플을 모두 넣어두었습니다.
• 참고 자료

3회차 과제

• 코드 다운로드
• day3_homework.html에 선택자 적용해서 정리하기
• 각자 태그 색상 마음에 드는 색으로 변경하기

참고 자료

주요 HTML 태그

- 루트 태그: html, head, body
- 레이아웃/텍스트 분류: div, span
- 비주얼 분류: img
- 인터렉션 분류: input, textarea, a
- 리스트 분류: ul/li, table
- 시맨틱 분류: header, footer, nav, article 

CSS 속성 분류

- 뷰: 태그의 보여짐 여부 결정
    * display
    * opacity, visibility
    * z-index
- 포지셔닝: 태그의 위치 결정
    * position
    * width, height
    * left, right, top, bottom
    * margin, padding
    * float
    * line-height
    * transform - translate
    * text-align
    * box-sizing
- 데코레이션: 태그의 디테일한 디자인 결정
    * border
    * color, font-size
    * background, background-image, background-color
    * cursor