HTML5/CSS3

태그: HTML페이지에서 객체를 만들 때 사용하는 것ex) <h1>, <br> ...요소: 태그를 사용해 만들어진 객체속성: 태그에 추가 정보를 부여할 때 사용하는 것ex) <h1 title='header'>, <img src="image.png"

특정한 HTML 태그를 선택할 때 사용하는 기능 \-> 해당 태그에 우리가 원하는 스타일 또는 기능을 적용할 수 있음선택자 + 스타일 속성 + 스타일 값전체 선택자: \* -> 모든 태그 선택 (html, head, title, style 태그까지 선택)태그 선택자:

스타일 속성은 하나하나 외우는 것이 아니다. 익숙해지자!! 1\. 키워드: none ...  2\. 크기 단위: %, em (배수 단위) --> 상대적, px --> 절대적  \* 태그 전체에 절대적인 크기를 지정하고, 일부를 상대적으로 변경하는 기법을 많이 사용  3

전형적인 웹 페이지 구성 요소 레이아웃 구분 > #### 공간 분할 순서 1) 웹 페이지 구상 2) 웹 페이지의 구성 영역 분리 3) 구성 영역을 행 단위로 분리 --> 가로로 선을 그릴 수 있는 부분을 분리 4) 나누어진 행의 내부 요소를 분리 초기화 --> 모든

1) HTML 페이지 구성2) 스타일 사용\* 변형 속성: 부드러운 애니메이션을 적용할 때 필요한 기능transition: 모든 transition 속성을 한 번에 사용transition-delay: 몇 초 후에 재생transition-duration: 몇 초 동안 재

\* transition (변형) -> 시간의 흐름을 가지고 일어나는 변경\* transform (변환) -> 시간의 흐름을 따고 가지지 않고 일어나느 형태의 변경1) 자바스크립트를 사용한 WebGL2) CSS3를 사용한 3차원 변환\* 화면의 왼쪽 상단 점이 영점X축

\--> CSS 코드 중 @가 붙은 단어\--> CSS 파일에서 다른 CSS 파일을 추가하는 방법 \--> CSS 파일의 규모가 커지면 코드를 쉽게 알아보기 위해 파일을 분리\--> 웹 폰트를 생성할 때 사용하는 규칙 1) font-family : 폰트 이름을 지정 2