Thumbnail
개발 · 프로그래밍 웹 개발

입문자를 위한 CSS 기초 강의 대시보드

(4.9)
177개의 수강평 ∙  3,364명의 수강생

무료

지식공유자: 유노코딩
총 21개 수업 (4시간 5분)
수강기한: 
무제한
수료증: 미발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유

입문자를 위해 준비한
[웹 퍼블리싱, 웹 개발] 강의입니다.

웹 사이트를 예쁘게 꾸미기 위해 반드시 필요한 언어, CSS의 주요 개념과 기본 문법을 소개합니다. 이제 막 HTML로 코딩 걸음마를 떼신 분들도 부담없이 소화하실 수 있습니다.

✍️
이런 걸
배워요!
CSS 용도
CSS 주요 개념
CSS 기본 문법

웹 페이지 꾸미기에 꼭 필요한,
css의 모든 것을 배울 시간!

'CSS 어린이' 를 위해 준비한 기초 강의 📖

css를 배우고 싶은 욕심만 있다면, 당신도 배울 수 있어요!

본 강의는 강의 소개와 마무리 인사를 포함, 총 21개 영상으로 구성된 입문자용 CSS 강의입니다. HTML에 대한 기초 지식만 가지고 계시면 부담없이 소화할 수 있는 강의입니다.

각 수업은 다음과 같은 흐름으로 진행됩니다. 

기초 이론 : 주요 개념들을 알기 쉽게 설명합니다.
실습 안내 : 학습한 내용을 직접 실습하며 확인합니다.
내용 정리 : 학습 내용을 정리하여 마무리합니다.

강의 목표 📜

입문자 분들이 부담감을 느끼지 않고 빠르게 공부하실 수 있도록 하기 위해, 꼭 필요한 주요 개념 위주로 내용을 구성했어요. 이 강의를 수강하고 나면 CSS 코드 작성에 필요한 능력, 그리고 추가적인 학습을 위한 기본기 등은 거의 다 갖추실 수 있을 거에요. 

이 강의를 들은 후 여러분은,

👉🏻   웹 개발 분야에서 CSS의 역할이 무엇인지 이해할 수 있어요.
👉🏻   CSS가 일하는 방식에 대해 이해할 수 있어요.
👉🏻   CSS의 기본 문법과 작성 방법을 익혀볼 수 있어요.
👉🏻   평소 즐겨 사용하는 웹 사이트의 스타일이 어떤 식으로 만들어졌는지 이해할 수 있어요.

이 강의에서 배우는 것들 

CSS, 기초 of 기초

CSS의 역할과 핵심 기초 문법, 그리고 HTML 문서와의 연결 등 CSS에 대한 가장 필수적인 기본 지식을 알려드립니다.

CSS 속성 완전정복 - 기본

선택자, 텍스트 꾸미기, 박스 모델 등 웹 콘텐츠의 기본적인 스타일을 정의하는 방법에 대해 공부합니다.

CSS 속성 완전정복 - 심화

요소를 포지셔닝 하는 법, 레이아웃을 다루는 원리와 그 방법 등
웹페이지 전체 그림을 구상할 때 필요한 개념에 대해 공부합니다.

강의 내용, 미리 확인해 보기!

기초 이론 설명

학습한 내용 실습

내용 정리


수강 전, 안내 사항을 확인하세요 🔍

하나. 다음과 같은 준비물을 챙겨주세요!

💻   컴퓨터
💻   코드 에디터 (수업에서는 Visual Studio Code를 사용해요)
💻   영타 능력 (속도가 느려도 괜찮아요)

둘. 수강 전 미리 알려드려요!

대부분의 영상에는 코드를 작성하는 장면이 등장하는데, 자칫 영상이 지루해질 수 있다고 판단해 대부분 배속 처리를 하였습니다. 따라서 코딩 실습을 따라하시는 경우 일시정지 기능을 적절히 활용해 가시면서 실습을 진행하시길 추천합니다!


이런 분들께 추천드려요!

🎓
학습 대상은
누구일까요?
코딩을 처음 접하는 사람
HTML을 공부 중이거나 공부해 본 사람
CSS 언어에 대해 알아보고 싶은 사람
📚
선수 지식,
필요할까요?
HTML
코드 에디터 사용법 (종류는 무관해요)

안녕하세요
유노코딩 입니다.
유노코딩의 썸네일

개발자 출신 십잡스 크리에이터.
프로그래밍 강사 겸 작가로 활동하고 있습니다.
유튜브 <유노코딩> 채널 운영 중입니다.

 

배움의 과정에서 겪는 불필요한 고통들이 사라지길 바라고, 또 그래야만 한다고 믿습니다.
경험자의 진정성과 경험을 나누면 고통은 줄어들 수 있습니다.

 

저의 모든 강의 콘텐츠에서 그런 마음을 느끼실 수 있도록 노력하겠습니다.
많은 분들이 코딩을 재미있게 느끼고, 단순하게 이해할 수 있도록 돕기 위해 항상 노력하고 있습니다.

 

감사합니다^^

커리큘럼 총 21 개 ˙ 4시간 5분의 수업
이 강의는 영상, 수업 노트가 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 1. 문법 학습 & 속성의 종류
기본 문법 및 사용 방법 15:23
선택자 1편 14:56
텍스트 꾸미기 속성 21:58
display 속성 & border 속성 10:52
박스모델 1편, 박스모델 소개 미리보기 11:56
박스모델 2편, margin padding 다루기 10:22
박스모델 3편, box-sizing 09:20
박스모델 4편, background 14:15
float 그리고 clear 09:43
position 1편, relative absolute 12:59
position 2편, fixed sticky 10:03
flexbox 1편, 정의 및 사용 방법 미리보기 10:33
flexbox 2편, 몇 가지 관련 속성 13:57
선택자 2편, 특성 선택자와 결합자 16:01
의사클래스(가상클래스) 미리보기 13:41
의사요소 10:39
inherit, initial, unset 13:33
z-index 09:56
섹션 2. 강의 마무리
수업 마무리 04:54
강의 게시일 : 2021년 06월 15일 (마지막 업데이트일 : 2021년 06월 15일)
수강평 총 177개
수강생분들이 직접 작성하신 수강평입니다.
4.9
177개의 수강평
5점
4점
3점
2점
1점
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
rlaxogud2111 thumbnail
5
CSS 공부할 때 정말 도움이 되는 강의입니다.
2021-12-25
박경태 thumbnail
5
설명 및 실습따라하기가 좋아요
2021-12-23
taho0915 thumbnail
5
정말 유익해요!
2021-12-09
dnwns0933 thumbnail
5
css를 시작하는 사람에게 추천합니다!
2021-12-15
즈르릉 thumbnail
4
간단한 것부터 배울 수 있는 강의입니다. css를 처음 시작하시는 분들께 추천드립니다.
2021-12-19
연관 로드맵
이 강의가 포함된 잘 짜여진 로드맵을 따라 학습해 보세요!