개발 · 프로그래밍

/

웹 개발

코딩은 처음이라 with 웹 퍼블리싱 - CSS

CSS 기초부터 애니메이션, 반응형까지 학습합니다. 실전 예제를 통해 학습한 내용을 복습하면서 확실하게 기본기를 다집니다.

(5.0) 수강평 17개

수강생 914명

Thumbnail

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

이런 걸
배워요!

  • CSS 선택자

  • CSS 서체 글자 스타일

  • CSS 레이아웃 - float, position

  • CSS 애니메이션, 반응형

HTML 다음은 CSS!
CSS로 돋보이는 웹페이지를 만드세요 ⭐

코딩은 처음이라 with 웹퍼블리싱

웹 문서 완성도를 높이는 CSS 🎨

CSS는 웹 문서에서 모양을 담당합니다. HTML 요소에서 대상을 선택하고 선택한 대상의 색상, 배경, 위치, 애니메이션 등을 설정하여 보기 좋고 사용도 편리한 웹문서를 만들 수 있어요.

이번 강의는 <코딩은 처음이라 with 웹 퍼블리싱 - HTML 기초>에 이어지는 강의로, HTML 학습이 되었다는 전제로 웹페이지 스타일 설정에 필요한 필수 테크닉을 학습합니다.

CSS는 HTML 요소에서 스타일 대상을 정확하게 선택하는 것이 우선입니다. 이번 강의에선 CSS 선택자를 확실하게 학습할 수 있어요. 반응형 기초를 확실하게 습득해서 다양한 너비의 기기에서 최적화되어 표현되는 웹 페이지를 구현합니다. transition 및 animation, transform 속성을 활용하여 애니메이션을 구현하는 방법까지 배워보세요.

강의를 들은 후 여러분은 CSS 선택자를 통해 원하는 요소를 정확하게 선택하고, 선택한 요소의 스타일을 자유자재로 설정할 수 있게 될 거예요!

✔️ 도서 저자 직강 강의를 만나보세요!

  • 본 강의는 영진닷컴의 도서 <코딩은 처음이라 with 웹 퍼블리싱>의 저자가 도서 내용을 기반으로 강의를 진행합니다. 도서와 함께 보시면 학습에 더 도움이 되실 거예요.
  • '코딩은 처음이라 with 웹 퍼블리싱 - HTML 기초' 강의를 수강한 후 본 강의를 이어 학습해주세요.
  • 보충학습이 필요하시다면 저자의 유튜브 채널에서 추가 강의를 만나보세요.

이런 분들께 추천해요 🙋‍♀️

HTML 기초는 있지만
CSS 기초가 부족한 분

반응형, 애니메이션 구현이
어려운 분

Flex를 활용한 유연한
레이아웃을 배우고 싶은 분


강의 특징 ✨

CSS 스타일 설정에 필요한 속성
하나하나 학습해요!

수년간의 강의 경력을 바탕으로
이해하기 쉽게 설명해드려요!

심플한 예제로
기본을 확실하게 다져요!

Flexbox를 통한
효율적인 레이아웃을 배워요!


이런 걸 배워요 📚

1) CSS 선택자를 확실하게 학습합니다. CSS의 시작은 대상을 정확하게 선택하는 것에서부터 시작합니다.


2) 서체 관련 스타일을 학습합니다.


3) 레이아웃과 관련된 필수 속성을 학습합니다.


4) 배경 관련 속성을 모두 학습합니다.

 


5) Flexible 레이아웃의 핵심 flex를 학습하여 더욱 다양한 레이아웃을 쉽게 구현합니다.


6) 애니메이션의 기초를 학습합니다.


7) 반응형의 기초를 확실하게 학습하고 실습합니다.

데스크탑 화면

태블릿 화면

모바일 화면


8) 앞 강의에서 작성한 HTML 웹페이지를, CSS를 활용하여 구현합니다. 


Q&A 💬

Q. 비전공자도 들을 수 있는 강의인가요?

HTML 강의를 수강했거나, 기초가 있으면 가능합니다.

Q. 수업 내용을 어느 수준까지 다루나요?

선택자부터 반응형까지 방대한 양을 다룹니다. 과욕은 금물입니다. 앞부분부터 차근차근 학습하면 수강 완료하실 수 있습니다.

Q. 완강한 다음엔 어떤 학습을 하면 좋을까요?

다양한 디자인을 참조하여 HTML과 CSS를 활용하여 웹페이지 제작을 연습해보세요. 그 후 Javascript 학습을 추천합니다.


지식공유자 소개 ✒️

안녕하세요. rock's easyweb 유튜브 채널 운영자 김동주 강사입니다.  

주요 도서

  • 웹디자인 & 웹 퍼블리싱을 위한 피그마 완벽 활용서 - 비제이퍼블릭 출판사

  • 코딩은 처음이라 with 웹 퍼블리싱 - 영진닷컴

Contact Me

오프라인 강의 정보, 추가 영상 등을 확인하실 수 있습니다. 


이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • HTML을 학습하신 분

  • 반응형 구현이 힘든 분

  • 애니메이션 기초가 부족한 분

선수 지식,
필요할까요?

  • HTML

  • 포토샵

■ [현재] 그린컴퓨터아트학원 웹퍼블리싱 강사
■ [현재] 웹 퍼블리싱 유튜브 채널 'Rock's Easyweb' 운영
■ 더조은 컴퓨터아카데미 웹 퍼블리싱 강사
■ 한빛 컴퓨터아카데미 웹 퍼블리싱 강사
■ 프론트엔드 퍼블리셔, 프론트엔드 퍼블리싱 전문강사
■ UI/UX 웹 디자인 포트폴리오 강의


[ 도서 ]
웹디자인 & 웹퍼블리싱을 위한 피그마 완벽 활용서 / 비제이퍼블릭
코딩을 처음이라 with 웹 퍼블리싱  / 영진출판사

 

[ 수상경력 ]
2022.08 그린컴퓨터 아트 학원 종로지점 - 우수강사 2021.06 그린컴퓨터 아트 학원 종로지점 - 우수강사 2018.06 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2017.05 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2016.05 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2015.10 그린 컴퓨터아카데미 신촌 지점 - 우수강사 

 

 

 

커리큘럼

전체

33개 ∙ (9시간 12분)

수업 자료

가 제공되는 강의입니다.

강의 게시일: 
마지막 업데이트일: 

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!