한 눈에 끝내는 HTML5/CSS3 - goormEDU

한 눈에 끝내는 HTML5/CSS3

웹 개발 시작은 여기서부터! 두고두고 꺼내 보는 HTML5/CSS3 기초 강좌

Lecture Introduction
Difficulty
Easy
Category
Web Programming - Programming
Tag
HTML, CSS, 웹프로그래밍, 웹기초, HTML기초, CSS기초
Certificate
You can issue a certificate of completion
Target Audience
- HTML조차 한 번도 해보지 않으신 분
- HTML과 CSS에 좀 더 개념적으로 접근하고 싶은 분
- 다양한 웹 서비스를 만들기 위해 처음 공부를 시작하는 분
- 웹 서비스가 어떻게 구성되는지 궁금하고 실제로 구현해보고 싶은 분


☁ ANYONE CAN DEVELOP
<한 눈에 끝내는 시리즈>는  모두가 개발자가 될 수 있도록 개발자 성장 중심의 생태계를 만들어 나가고 있는 구름에서 만든 오리지널 강좌입니다. 프로그래밍 지식이 없는 분들도 쉽고 재밌게 배울 수 있도록 꼭 필요한 내용만 골라 기획했습니다. 이미 어느 정도 프로그래밍 지식을 가지고 계신 분이라면 두고두고 꺼내보는 문법 기초 강의가 될 거예요. 프로그래밍을 쉽고 간편하게 배우고 싶다면 구름에서 시작해 보세요. 여러분의 개발 커리어 여정에 끝까지 함께 하겠습니다. 




코린이 웹린이 모이세요! 세상에 많고 많은 웹 서비스들! 도대체 이 많은 웹 서비스들은 어떻게 만들어졌을까요? 웹 개발이 궁금했는데 뭐부터 배워야할 지 어려웠거나 나만의 웹을 직접 만들어보고 싶은 분들이라면 HTML과 CSS로 웹의 구조와 스타일을를 잡아보세요. 왜 배워야 하나요? 기술에 대한 고민과 이해는 자연스럽게 관련 직군에 대한 이해도도 증가시키기 때문에 요즘은 비전공자 혹은 비 개발 직군에게도 기초적인 개발 지식을 요구하는 경우가 점차 증가하고 있습니다. HTML5/CSS3는 웹 구성에 사용되는 언어라 웹 개발에 관심 있는 분들이 가장 먼저 시작하는 언어이기도 합니다. 여기에 JavaScript까지 묶으면 웹 페이지를 만들 수 있는 가장 기초적인 구성이 됩니다. 이 세 가지에 대해 학습한다면 단순한 기술을 습득하고 사용하는 것을 넘어 웹 서비스 및 IT 기술의 역사까지 이해하시게 될 거예요. 이런 분에게 추천해요 - 프로그래밍을 해보지 않은 비 전공자로 관련 지식이나 경험이 없으신 분 - 웹 서비스를 제작하기 위해 가장 처음에는 무엇을 해야 하는지 궁금하신 분 - HTML 조차 한 번도 해보지 않으신 분 - HTML과 CSS에 좀 더 개념적으로 접근하고 싶은 분 - 다양한 웹 서비스를 만들기 위해 처음 공부를 시작하는 분 - 웹 서비스가 어떻게 구성되는지 궁금하고 실제로 구현해보고 싶은 분 천천히 읽으며 따라하는 HTML5/CSS3 전공자에게도 개발 공부는 쉽지 않습니다. 비전공자나 비 개발 직군이라면 컴퓨터 과학에 대한 개념을 이해하기 어려운 경우가 많기에 더더욱 쉽지 않죠! 그렇기 때문에 이 강좌는 초보자도 쉽게 접근할 수 있는 HTML5/CSS3를 먼저 다루며 해당 내용들을 좀 더 쉽게 이해할 수 있는 꼼꼼한 설명과 유용한 실습을 통해 코딩 감각을 익힐 수 있도록 제작되었습니다. 설치 없는 실습 환경 온라인 프로그래밍 강의를 한 번이라도 수강해 본 적이 있다면 실습을 위해 따로 실습 환경을 구축하거나 웹페이지를 번갈아가며 실습했던 경험이 있으실 텐데요. 구름EDU에서는 이미 모두 갖추어진 실습환경에서 직접 코드를 작성하고 실행하며 HTML5/CSS3의 기본을 다질 수 있어요! 쉽게 말하면, 별도의 설치 없이 한 화면에서 이론과 실습을 동시에 할 수 있다는 뜻입니다. 기본 개념을 예시 코드로 바로 실행해보면서 학습할 수 있는 가장 효과적인 강좌입니다!



안녕하세요. 장순호입니다 개발 문화를 사랑하며 UI/UX 디자인에 관심이 많은 프론트엔드 웹 개발자입니다. 제 Github에 놀러 오세요 : ) - 現 IT엔터테인먼트 우물128번지 소속 웹 분야 개발자 - 리디북스 Web Animation With 냥이집사 공동저자 - 前 멀티캠퍼스 기초 파이썬 강사


Preview
Expand All
Curriculum
Expand All
  • 01
    시작하기에 앞서
  • 강의의 방향
    프로그래밍이란?
    HTML이란?
    CSS란?
    HTML 맛보기
    CSS 맛보기
  • 02
    개발 환경 설정
  • 구름IDE
    Visual Studio Code
    Atom
    Brackets
    Sublime Text
  • 03
    HTML 기초
  • 강의 목표
    HTML의 기본 구성
    기본적인 HTML 문서 구조
    Head와 Body
    기본적인 레이아웃
    정리
  • 04
    제목, 내용 관련 태그
  • 강의 목표
    제목과 본문 태그
    나누기 위한 태그
    글자와 관련된 태그
    정리
  • 05
    링크 태그
  • 강의 목표
    링크 태그란
    링크 태그의 속성
    웹사이트의 경로와 주소
    정리
  • 06
    멀티미디어 관련 태그
  • 강의 목표
    이미지 태그
    오디오와 비디오 태그
    유튜브 영상 삽입
    정리
  • 07
    입력 양식 태그
  • 강의 목표
    입력 양식(form)
    form 태그
    input 태그
    select 태그
    textarea 태그
    button 태그
    정리
  • 08
    테이블과 리스트
  • 강의 목표
    표(Table)
    목록(List)
    목록 태그의 속성
    정리
  • 09
    CSS 기초
  • 강의 목표
    CSS의 의미와 구성 요소
    선택자(Selector)에 대하여
    CSS의 기본 단위
    CSS의 색상
    정리
  • 10
    선택자(Selector)
  • 강의 목표
    단순 선택자
    복합 선택자
    가상 클래스 선택자
    정리
  • 11
    Box 모델
  • 강의 목표
    박스(Box)모델
    content
    border
    padding과 margin
    정리
  • 12
    글자(Text) 관련 스타일
  • 강의 목표
    폰트 종류와 웹 폰트
    폰트의 크기와 형태
    텍스트 정렬
    정리
  • 13
    위치 정렬
  • 강의 목표
    block과 inline
    inline-block
    position
    float
    정리
  • 14
    위치 정렬 - flexbox
  • 강의 목표
    flexbox에 관하여
    flex container: 방향과 흐름
    flex container: 정렬1
    flex container: 정렬2
    flex container: 정렬3
    flex item
    정리
  • 15
    위치 정렬 - grid 1
  • 강의 목표
    grid layout 기본
    grid container: template
    grid container: gap
    grid container: auto
    grid container: grid
    grid container: align & justify
    정리
  • 16
    위치 정렬 - grid 2
  • 강의 목표
    grid item: row, column
    grid item: area
    grid item: self
    정리
  • 17
    상속과 우선순위
  • 강의 목표
    상속
    우선순위
    정리
  • 18
    종합 예제 - 회원가입 페이지 만들기
  • 강의 목표
    레이아웃 구성
    회원가입 폼 만들기1
    회원가입 폼 만들기2
    회원가입 폼 만들기3
    하단 메뉴 만들기
    강의를 마치며
Instructor Introduction
user
구름Teacher

Lecture Reviews
Ends in D-0
99,000
59,400
(40%)

Average Rating
4.9
Difficulty
Easy
Lecture Period
Unlimited