Shop by
Godomall
HTML/CSS
Photoshop
고도몰 무료강좌
고도몰 기본강좌
고도몰 모바일
고도몰 활용강좌
고도몰 Tip
기초강좌
활용강좌
Notion
SQL
Free (무료동영상)
Blog
Excel
Powerpoint
AutoCAD
PHP
GodoMall 4
마이페이지
처음사용자
자
이용안내
이용문의
공지사항
어서와~ HTML5 CSS3는 처음이지~
There is no sample lecture.
1
HTML이란 무엇이고 무엇을 배우는 것인가 [전체 강의소스 다운]
2
HTML 태그별 배우는 난이도가 어려운거는
3
HTML CSS 종합예술 - 레이아웃 예제 미리보기
4
코딩 전문 에디터 아톰 - 학습을 위한 준비물
5
코딩 전문 에디터 아톰 - 설치하기
6
코딩 전문 에디터 아톰 - welcome 페이지 숨기기
7
코딩 전문 에디터 아톰 - 기본환경 설정하기
8
HTML5 기본적인 형태
9
한글이 깨져서 나타나보일 때
10
title 태그
11
태그 들여쓰기에 대해서
12
텍스트태그 - p
13
텍스트태그 - br
14
텍스트태그 - pre
15
텍스트태그 - b
16
텍스트태그 - i
17
텍스트태그 - u
18
텍스트태그 - strike
19
텍스트태그 - 제목태그
20
텍스트태그 - 한자어 표기
21
CSS로 메이크업(화장) 시켜보자 - 한글 표기음 축소
22
이미지태그 사용법1
23
이미지태그 사용법2
24
a 링크 태그 사용법1
25
a 링크 태그 사용법2
26
번호없는 목록 태그 ul
27
번호있는 목록 태그 ol
28
목록 태그 디자인타입 3가지 및 안보이게 css로 처리
29
쉬어가는 페이지 - 목록 태그가 실제 많이 쓰이는 곳은
30
테이블태그1 - 가장 기본적인 형태
31
테이블태그2 - 용어이해 cell
32
테이블태그3 - cellpadding cellspacing
33
테이블태그4 - Cell 병합
34
테이블태그5 - 다중 Cell 병합
35
테이블태그6 - Raw(줄) 병합
36
테이블태그7 - Raw(줄) 병합 여러가지 실습 테스트
37
Video 태그 사용법1 - 가장 기본적인 형태
38
Video 태그 사용법2 - 동영상 컨트롤 제어 및 자동플레이
39
Form1_폼 태그 기본 사용법
40
Form2_input
41
Form3_input_password
42
Form4_input_checkbox
43
Form5_input_checkbox_multi
44
Form6_input_checkbox_multi_checked
45
Form7_input_radio
46
Form8_input_button
47
Form9_input_file
48
Form10_input_search
49
Form11_input_reset
50
Form12_input_submit
51
Form13_select
52
Form14_select_selected
53
Form15_label
54
Form16_label2
55
Form17_placeholder
56
Form18_input_size
57
Form19_textarea
58
Form20_fieldset
59
Form21_fieldset2
60
Form22_input_hidden
61
00_CSS란 무엇이고 선수학습은 무엇인가
62
01_CSS Annotation
63
02_CSS 작성법1 - inline
64
03_CSS 작성법2 - embedded
65
04_CSS 작성법3 - external
66
05_외부 css 파일 연동시 문자코드 기술하기
67
06_import 방식으로 외부 css 파일 불러오기
68
07_css 작성방식 4가지 비교
69
08_css 범위와 들여쓰기
70
09_css 상속에 대해서
71
10_외부 import 파일의 속성을 바꿔서 사용하기
72
11_BreakTime - CSS는 어떤걸 배우는 건가요
73
12_div 태그는 박스모델이다 특징과 속성 이해
74
13_div 태그 속성 변경 border padding margin
75
14_div 태그 속성 변경2
76
15_css 코드 기술 방식에 대해서
77
16_글자 수직으로 가운데 정렬하는 Tip
78
17_css 초기화 작업이 뭔가요
79
18_마진영 오토 - div 박스 가운데 정렬하기
80
19_헤갈리는 패딩 옵션 값 정복하기1
81
20_헤갈리는 패딩 옵션 2가지 값만 사용한건 뭐지
82
21_padding 옵션 값 3개만 있는 경우
83
22_margin 속성도 padding 과 똑같다
84
23_인라인 방식과 블럭 속성의 개념 및 차이(중요)
85
24_다른 태그들의 인라인 블럭 속성 알아내는 방법
86
25_인라인 속성과 블럭 속성 종합정리
87
26_인라인 속성과 블럭 속성 종합정리 - 실습
88
27_인라인 블럭 속성을 다 가지는 인라인블럭 속성
89
28_패딩 옵션 4방향을 명시적으로 지정하는 방법(보강)
90
29_블럭 속성을 사용한 세로 메뉴 만들기
91
30_display 인라인블럭 속성 이해 더 나아가기
92
31_선택자란 무엇이고 무엇을 학습하는건가
93
32_타입 선택자 - 태그 선택자
94
33_클래스 선택자1
95
34_클래스 선택자2
96
35_클래스 선택자3
97
36_클래스 선택자4 - 타입선택자와 클랙스선택자 혼합
98
37_아이디 선택자1
99
38_아이디 선택자2
100
39_아이디 선택자3
101
40_지금까지 배운 선택자 3개 종합연습
102
41_css 코딩연습(1) - 1 마크업 2 네이밍작성
103
42_css 코딩연습(2) - 3 스타일선언 4 명시적 선언이란
104
43_css 코딩연습(3) - 명시적인 선언의 우선순위
105
44_css 코딩연습(4) - 스타일 상속 및 우선순위
106
45_전체 선택자
107
46_선택자 Grouping
108
47_쉬어가는 Breaktime
109
48_폰트 색상 적용하는 다양한 방법 3가지
110
49_Color Picker로 원하는 색상 추출하기
111
50_폰트 속성(1) - font-family font-size
112
51_폰트 속성(2) - 쌍따옴표 홑따옴표 영문이름명 띄어쓰기
113
52_폰트 속성(3) - 나눔고딕 및 영문이름 표기원칙
114
53_폰트 속성(4) - 영어는 영문폰트로 나타내고 싶을 때는
115
54_폰트 속성(4) - 영문폰트 적용시 주의사항
116
55_폰트 속성(5) - 폰트 스타일 italic normal oblique
117
56_폰트 속성(6) - font-weight bold 100 900 단위로 주기
118
57_폰트 속성(7) - 글자 간격을 조절하려면
119
58_serif sans serif monospace 서체가 뭔가요
120
59_serif sans serif monospace 실습하기
121
60_폰트 속성 상속을 개발자도구로 확인하기
122
61_글자 라인간의 간격을 넓히고 줄이고 싶다면
123
62_텍스트에 선긋기(1) - underline overline line-through
124
63_텍스트에 선긋기(2) - 아래 위로 선긋기 선 없애기
125
64_font-family 사용법 종합정리 및 generic family 정확히 이해하기
126
65_텍스트에 은은한 그림자효과 주기
127
66_div 박스모델에 은은한 그림자효과 주기
128
67_모든 텍스트를 대문자로 바꾸려면
129
68_텍스트 정렬하기 - justify center left right
130
69_박스 영역을 넘어가는 긴문장 잘라서 박스안으로 넣으려면
131
70_글자 단위로 잘라내기 및 단어 단위로 잘라내기
132
71_단어 사이의 간격을 벌려주고 싶다면
133
72_white-spacing 옵션 특징 3가지 - 줄바꿈 공백 줄라인
134
73_white-spacing pre pre-line 특징 정리하기
135
74_white-spacing pre-wrap 특징 정리하기
136
75_긴 텍스트를 2단으로 나누기 - column-count
137
76_단과 단 사이의 공간인 gap을 넓혀주려면
138
77_단과 단 사이에 막대 bar 를 넣고 스타일 적용하기
139
78_쉬어가는 차원에서 간단한 연습문제
140
79_column-rule 스타일을 축약형으로 짧게 한줄로 쓰려면
141
80_막대기 bar 스타일 다양하게 지정해보기
142
81_아주 중요한 반응형 속성으로 컬럼 단 조절하기 ★★★
143
82_컬럼 내부 상단에 제목을 넣어 중앙에 정렬시키기
144
83_컬럼 내부 상단에 제목 좌우로 정렬
145
84_자손 선택자와 자식 선택자의 개념 이해하기(중요)
146
85_자손 선택자 자식 선택자 - 연습 및 개념복습
147
86_pseudo-class 개념이해 및 사용법
148
87_다소 어려운 nth-child 선택자 완벽히 이해시킨다(1)
149
88_다소 어려운 nth-child 선택자 완벽히 이해시킨다(2)
150
89_다소 어려운 nth-child 선택자 완벽히 이해시킨다(3)
151
90_nth-child 완벽이해(4) - 왼쪽메뉴 예제1
152
91_nth-child 완벽이해(5) - 왼쪽메뉴 예제2
153
92_nth-child 완벽이해(6) - 게시판 글목록 예제
154
93_배경 색 지정하기
155
94_배경 색상의 상속에 대해서
156
95_배경으로 이미지를 지정해서 넣기
157
96_div 박스 배경으로 이미지를 지정해서 넣기
158
97_배경 색상을 상속받기를 원한다면 inherit
159
98_배경 색을 지정해서 넣어주려면 background-clip
160
99_배경 이미지 반복해서 지정하는 방법
161
100_배경이미지를 박스 사이즈에 맞춰서 출력하기 background-size
162
101_배경이미지 픽셀과 퍼센트 단위로 사이즈 조절하기
163
102_배경이미지 사이즈 값을 하나만 주는 경우는
164
103_배경이미지 위치를 잡아주고 싶다면 background-position
165
104_배경이미지 위치를 픽셀 단위로 콕 찍어서 지정하기
166
105_background 속성과 값들을 한 라인에 축약형으로 쓰는 방법
167
106_Position 속성 개념 이해하기
168
107_Position 속성 이해하기 - static
169
108_Position 속성 이해하기 - relative 완벽이해(1)
170
109_Position 속성 이해하기 - relative 완벽이해(2)
171
110_Position 속성 이해하기 - relative 완벽이해(3)
172
111_relative 속성을 사용해서 가운데 정렬시키기
173
112_relative 적용시 주의할 사항
174
113_영역을 벗어난 경우 안보이게 감추기 overflow - hidden
175
114_가장 많이 사용하는 포지션 속성 absolute 완벽이해(1)
176
115_가장 많이 사용하는 포지션 속성 absolute 완벽이해(2)
177
116_포지션을 이용하여 원하는 위치에 배너박스 고정시키려면
178
117_쇼핑몰 우측에 고정된 배너처럼 만들어보기
수강기간 :
2
개월 / 수강료 :
\110,000
원
- HTML5 CSS3는 홈페이지/쇼핑몰을 만들 때 배우는 언어입니다.
- 영어를 배울 때 기본문법을 배우듯이 홈페이지나 쇼핑몰을
- 내가 직접 만들고자 할 때 이러한 HTML5, CSS3 를 공부합니다.
- 최대한 HTML5/CSS3 입문자들이 기초부터 차근차근 공부하여
- 이 긴 여정의 학습을 마스터할 수 있도록 많은 노력을 하면서 촬영하였습니다.
- 그만큼 HTML5/CSS3 입문자와 초보자의 눈높이에서 하나하나
- 자세히 설명해드리고 완벽한 이해를 목표로 합니다.
- 학습자의 눈높이에 맞춰서 어려운 용어나 개념을 잘 이해시키면서
- 진행하므로 진도가 빠르게 나갈 수 있습니다.
- 물 흐르듯이 강의를 볼 수 있을겁니다.
- 어렵지않게 HTML5/CSS3를 공부할 수 있습니다.
VIP Freepass 전과정 자유이용권 혜택보기