Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS AWS Certified Developer - Associate CompTIA Security+
Photoshop Graphic Design Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Personal Transformation Meditation Life Purpose Coaching Neuroscience
Web Development JavaScript React CSS Angular PHP Node.Js WordPress Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
2020-12-28 23:37:57
30-Day Money-Back Guarantee

This course includes:

  • 41.5 hours on-demand video
  • 24 articles
  • 272 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
Development Web Development CSS

HTML & CSS Tutorial and Projects Course

Web Development for Absolute Beginners.Learn HTML5 and CSS3 from scratch.​ Build Amazing Real World Projects.
Rating: 4.5 out of 54.5 (1,654 ratings)
7,416 students
Created by John Smilga
Last updated 1/2021
English
English [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Learn HTML5 from scratch.
  • Learn CSS3 from scratch.
  • Create responsive real world projects from scratch.
  • Learn CSS Grid and Flexbox Layout Modules.
  • Learn where to get free images, custom fonts.
  • Learn how to work with font-awesome icons
  • Learn where to get custom color palettes.
Curated for the Udemy for Business collection

Course content

26 sections • 403 lectures • 41h 23m total length

  • Preview02:15
  • Preview01:37
  • Course Review
    00:32

  • HTML Intro
    02:46
  • Google Chrome and Visual Studio Code
    00:48
  • Download Google Chrome
    03:10
  • Download Visual Studio Code
    01:49
  • Visual Studio Code Overview
    04:09
  • Create A Project
    02:24
  • First Webpage
    04:48
  • Basic HTML Document Structure
    02:34
  • Implement HTML Document Structure
    03:19
  • Live Server Extension Setup
    05:58
  • Extra Settings and Emmet
    07:19
  • Heading Elements
    04:09
  • Preview00:03
  • Paragraph Element
    01:52
  • White Space Collapsing
    01:24
  • Lorem Ipsum
    03:14
  • Image Basics
    03:49
  • Multiple Images
    04:21
  • External Images
    03:25
  • Nice Images
    04:03
  • Width and Height
    03:21
  • Crop Images
    03:00
  • Comments and Line Breaks
    05:44
  • External Links
    05:15
  • Internal Links
    04:34
  • Links - Within a Page
    06:23
  • Image Links - Empty Links
    03:57
  • Sup and Sub Elements
    02:32
  • STRONG and EM Elements
    02:59
  • Special Characters
    03:23
  • Unordered Lists
    03:57
  • Ordered Lists
    01:04
  • Nested Lists
    01:44
  • Table Element
    02:52
  • Forms - Input Elements and Submit Elements
    13:36
  • Forms - Textarea, Radio,Checkboxes, Select
    11:36
  • Install Prettier Code Formatter
    05:07
  • Keyboard Shortcuts
    10:15
  • Head Element - External Resources
    04:49

  • Intro
    03:16
  • Setup
    03:12
  • Project Assets
    00:04
  • Download Images
    02:30
  • Logo, Heading, Navbar
    03:02
  • Home Page
    13:10
  • About
    03:05
  • Numbers
    06:07
  • Contact
    05:03
  • Complete Project
    00:03

  • CSS Intro
    01:29
  • Workspace Setup
    03:00
  • Text Editor Setup
    05:47
  • Video Resources
    00:03
  • Inline CSS
    04:05
  • Internal CSS
    02:22
  • External CSS
    09:57
  • Power Struggle
    04:57
  • Basic CSS Syntax
    07:35
  • Element Selectors
    02:39
  • Grouping Selectors
    02:01
  • ID Selectors
    04:40
  • Class Selectors
    04:41
  • ID and Class Selector Summary
    01:52
  • DIV and SPAN Elements
    07:58
  • Inheritance in CSS
    05:33
  • Inheritance More Info
    02:49
  • Last Rule, Specificity and Universal Selector
    09:39

  • Colors Intro
    00:27
  • Color and Background-color Properties
    04:16
  • Color Names
    02:47
  • RGB
    06:27
  • RGBA
    09:45
  • HEX Values
    06:08
  • VS-Code Color Options
    02:50
  • External Resources
    01:52

  • Units Intro
    00:29
  • Pixels, Font-Size, Width, Height
    05:43
  • Percent Units
    04:57
  • Em Units
    05:45
  • Rem Units
    03:01
  • Vh and Vw
    06:17
  • Default Browser Styles and Chrome DevTools
    12:04
  • Calc Function
    07:00
  • Min-height, Max-height
    10:31

  • Typography Intro
    00:22
  • Font-family
    02:36
  • Font-Stack Generic Fonts
    02:55
  • Google Fonts
    06:48
  • Font-weight Font-style
    07:07
  • Text-align Text-indent
    02:59
  • More Text Properties
    11:18

  • Box-Model Intro
    00:15
  • CSS Box Model - Padding
    09:32
  • CSS Box Model - Margin
    06:48
  • CSS Box Model - Border
    06:28
  • Border-radius Negative Margin
    04:38
  • Outline Property
    09:11

  • Display Property Intro
    00:16
  • Display Property
    07:40
  • Basic Horizontal Centering
    04:17
  • Mobile Navbar Example
    12:46
  • Box-sizing : border-box
    07:29
  • Display inline-block
    03:33
  • Display:none, Opacity, Visibility
    08:34

  • Intro
    00:50
  • Setup
    02:49
  • Background Images Basics
    04:34
  • background-repeat
    07:24
  • background-size
    03:17
  • background-position
    04:33
  • background-attachment
    06:30
  • Linear Gradients
    12:54
  • Background Image Overlay
    10:26
  • Colorzilla
    03:37

Requirements

  • No programming/coding experience as we will start from absolute scratch
  • Any computer - Mac, PC.
  • Any Text Editor. We will download Brackets Text Editor but will be able follow along with any text editor.
  • Any Web Browser. Chrome,Firefox.(Chrome is requirement only if wants to use Brackets Live Preview).
  • All required software is free!!!!

Description

If you want to start your career in Web Development, HTML and CSS are essential skills to have because they are foundational languages of the web.

HTML stands for Hyper Text Markup Language. In short HTML is a markup language that is used developing web pages.

CSS stands for Cascading Style Sheets. In short CSS is a language responsible for layout and styling of the web pages.

In this course we will cover both languages from the scratch and by the end of the course become HTML and CSS ninjas by building Responsive Real World Projects.

Why you should take this course?

Reason Number ONE - You Will Understand the Web Better.

Knowing the HTML and CSS and how they are used to create web pages is essential for web developer as they are building blocks of every web page.

Reason Number TWO - You Will be able to Create Websites.

Once you will know HTML and CSS you will be able to create a personal,unique web page for yourself.

Reason Number THREE - Start a Web Career.

For anybody who wants to pursue a career in Web Development knowledge of HTML and CSS is required. 

Reason Number FOUR - You Will Progress to Another Programming Languages with Greater Ease.

Once you know the fundamentals of HTML and CSS you will be able to pick up languages like Javascript with greater ease.

Reason Number FIVE - We Will Learn HTML and CSS from Scratch and Will Use it to Build Responsive Real Life Projects.

Not only we will learn the theory of HTML and CSS step by step. We also will apply our knowledge by building Real Life Projects.

Who this course is for:

  • Anyone who wants to learn Web Development from scratch.

Featured review

Yagya Joshi
Yagya Joshi
371 courses
51 reviews
Rating: 5.0 out of 5a year ago
I learned so many things from this course. I practiced many aspects of web design. It has opened my eyes to other areas that are required of a web developer. I do now realize that why this is a never ending endeavor. You need to continue to learn to keep yourself up to date. This also showed me that there is no one way of website design and development; people can approach different ways. The one thing that is essential is understanding the core---which this course provides.

Instructor

John Smilga
Instructor
John Smilga
  • 4.7 Instructor Rating
  • 6,277 Reviews
  • 53,748 Students
  • 6 Courses

Hello, I am John Smilga and I am a web developer. I live and work in Los Angeles, CA. I spend most of my day, experimenting with HTML, CSS and Javascript (and it's endless list of frameworks). I enjoy coding and the challenge of learning something new everyday. You can also find me at youtube channel Coding Addict.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.