PRE-PUBLISHING
1.HTML/CSS 시작하기& 환경설정&아이디클래스개념&선택자
웹 편집기 : visual studio code 사용.실시간 코드 적용 화면 보기 위해'Live Server' 확장 프로그램 설치. 실행방법 : 작성 화면에서 마우스 우클릭 --> Open with live server실행 브라우저 설정 : 컴퓨터 설정 --> 기본앱
2.margin&padding&요소겹침&정렬&이미지속성&inline-block&그룹속성
01basic.htmlalign.htmlbackground.htmldisplay.html※ span : inline속성. width와 height를 설정할 수 없음.groupcss.html
3.list&table&게시판만들기예제
list.htmlpractice.htmlbasic.htmlboard.html
4.입력태그 form
basic.html
5.포지션기본&메뉴만들기예제
basic.htmlfixed.htmlzindex.htmlex.html
6.폰트설정
구글폰트 바로가기(무료)한글, 영어 호환 font 검색굵기 선정, font select.view selected families 선택하여 selectedfonts 확인.basic.html눈누폰트 바로가기(무료)os에 맞는 다운로드 후 ttf확장자를 eot와 woff로
7.transform&transition&animation&큐브 만들기
interaction.htmltransition.htmlcube.htmlanimation.html
8.video&가상클래스
01basic.html유튜브 iframe 태그vimeo iframe 태그vimeo 바로가기peseudo-element.htmlselect.html
9.semantic&flex&decoration&wrap
semantic.htmldisplay_me.htmldecoration_me.htmlwrap_me.htmljustify-contents_me.htmlalign-items.htmlalign-content_me.htmlflex-grow_me.htmlflex_me.htmlal
10.구글 ICON 등 채우기 색 변경하기
SVG아이콘 파일 다운로드(SVG : 태그를 이용하여 파일의 속성(색상) 등을 변경 가능하게 함.)illustrator 실행 후 SVG 파일 OPENWindow -> color 선택변경하고자 하는 색으로 바꿔주기 -> 저장Visual Studio Code에서 style