/
CSS 실무 20년이상 경력을 기반으로한 CSS 기초 강의에 오신 것을 환영합니다! 이 강의는 웹 퍼블리셔와 프론트엔드 개발자로 성장하기 위한 첫 걸음을 내딛는 여러분을 위해 준비되었습니다.
5명 이 수강하고 있어요.
이런 걸 배워요!
CSS기초문법
CSS최신문법
해당 강의는 CSS 기본 문법을 다루며, 간단한 예제를 통해 응용해 볼 수 있습니다. 무엇보다 중요한건 주어진 피그마 디자인으로 스타일링 하는것입니다.
해당과정은 리베하얀 HTML 과정을 듣고 오시는것을 추천드립니다.
💡 해당 과정은 일회성 판매를 목적으로 하지 않습니다.
강의영상은 모듈로 구성되어 있습니다. CSS 추가 스펙이 있을때마다 영상이 추가됩니다.
따라치는건 무의미 합니다. 제가 알려드린 개념을 가지고 응용제작해보세요.
읽는법부터 깊이 있는 표현방법까지 다양하 시각으로 CSS를 안내해드립니다. Nesting, @layer와 같은 최신 스펙은 물론 활용예제 까지 가이드해드립니다.
CSS3 기초문법
해당 과정의 주된 목적은 실무 응용입니다. 기초 문법을 학습하신 뒤 공유받은 피그마 샘플을 가지고 미션을 수행해보세요. 저와 함께 고민하면서 해결해 나아간다면 많은 자신감을 얻으실 수 있습니다.
Figma 리소스 실무 미션
모든 OS가 가능합니다.
사용 도구: VSCode (에디터는 편하신것 사용하세요)
PC 사양: 인터넷 접속이 가능한 기본 사양의 PC
노션 공유 : 회원가입후 공유신청하세요.
피그마 : 미션 수행을 위해 회원가입후 공유신청하세요.
HTML을 이해하시면 도움이 됩니다.
영문타자가 느리시면 학습에 불편할 수 있으니 영타연습꾸준히 해주세요.
본 강의의 저작권은 리베하얀에 있으며, 무단 배포 및 복제를 금지합니다. 학습 자료 역시 저작권이 있으며, 개인적인 학습 목적 외 사용을 금합니다.
학습 대상은 누구일까요?
코딩을 처음 접하는 사람
CSS를 깊게 이해하고 싶은 사람
선수 지식, 필요할까요?
HTML
2000년부터 웹퍼블리셔2008년부터 웹퍼블리셔 육성 강사2016년부터 리베하얀 유튜버 활동
오랜기간부터 웹퍼블리셔 실무자로 활동해온 모든 노하우를 알려드리고 있습니다.
전체
35개 ∙ (7시간 11분)
섹션 1. 수업진행 자료
1개
수업자료
섹션 2. Basic
3개 ∙ (33분)
CSS
09:02
How to Use CSS
11:08
ID vs Class
13:07
섹션 3. Selector
6개 ∙ (1시간 4분)
CSS Selector Specificity
09:49
CSS Selector Basic
17:42
CSS Selector :pseudo-class
09:23
CSS Selector ::pseudo-element
11:35
CSS Nesting
07:28
BEM
08:19
섹션 4. Text
1개 ∙ (21분)
Font
21:13
섹션 5. Box
5개 ∙ (31분)
padding / margin
08:00
border / outline
08:31
box-model
06:11
shadow
04:45
radius
04:05
섹션 6. Variable
2개 ∙ (36분)
variable
10:55
UI 제작 실습 Part1
25:17
섹션 7. Layout
7개 ∙ (1시간 41분)
block / inline / display
17:50
position
19:58
flex
15:37
grid
12:17
order
03:33
isolation
08:42
UI 제작 실습 Part2
23:19
섹션 8. Effect
6개 ∙ (56분)
filter
05:00
background
13:15
gradient
09:33
transform
07:30
transition / animation
16:49
overflow
04:36
섹션 9. At Identifier
3개 ∙ (1시간 15분)
@layer
10:19
@scope
21:54
UI 제작 실습 Part3
43:28
섹션 10. Function
1개 ∙ (11분)
light-dark()
11:19