HOME > Development > HTML CSS Learn to Build Responsive Websites

HTML CSS Learn to Build Responsive Websites

  • Development
  • Dec 13, 2024
SynopsisHTML & CSS – Learn to Build Responsive Websites, av...
HTML CSS Learn to Build Responsive Websites  No.1

HTML & CSS – Learn to Build Responsive Websites, available at $19.99, with 59 lectures, and has 2 subscribers.

You will learn about Understand HTML, CSS, and responsive web design Build responsive web pages with HTML, CSS, and flexbox Organize CSS code into reusable and efficient code Develop foundational knowledge of markup to learn more advanced ui libraries easier This course is ideal for individuals who are Beginner programmers who want to learn HTML & CSS to build responsive web pages It is particularly useful for Beginner programmers who want to learn HTML & CSS to build responsive web pages.

Enroll now: HTML & CSS – Learn to Build Responsive Websites

Summary

Title: HTML & CSS – Learn to Build Responsive Websites

Price: $19.99

Number of Lectures: 59

Number of Published Lectures: 59

Number of Curriculum Items: 59

Number of Published Curriculum Objects: 59

Original Price: $79.99

Quality Status: approved

Status: Live

What You Will Learn

  • Understand HTML, CSS, and responsive web design
  • Build responsive web pages with HTML, CSS, and flexbox
  • Organize CSS code into reusable and efficient code
  • Develop foundational knowledge of markup to learn more advanced ui libraries easier
  • Who Should Attend

  • Beginner programmers who want to learn HTML & CSS to build responsive web pages
  • Target Audiences

  • Beginner programmers who want to learn HTML & CSS to build responsive web pages
  • In this course we’re going to learn the fundamentals of HTML and CSS markup code.

    We’ll start with learning a variety of concepts like positioning, display types, CSS specificity, colors, and more. Once we’ve covered the fundamentals, we’ll learn about Flexbox, a modern implementation of CSS to create responsive and fluid layouts for your web pages.

    Once we’ve covered these html and css concepts, we’ll take what we’ve learned and apply our knowledge to create a responsive web page from scratch.

    Here’s a comprehensive list of the concepts we’ll learn in this course:

  • Introduction to HTML. Initial setup, and what are HTML Tags?

  • Differences between border, margin, and padding. How and when to use each.

  • CSS Classes and IDs

  • CSS Combinators: Style elements under very specific circumstances.

  • CSS positioning: Absolute, Fixed, Relative, and Sticky

  • Adding CSS Styles in head tag, inline, and with external stylesheets

  • Using “variables” or Custom css properties for reusability

  • Display types: Block, inline, inline-block

  • Form styling: How to style each element of a form, like borders, placeholders, etc.

  • Media Queries for Responsive web design by changing styles for a variety of screens

  • Pseudo classes: Targeting every other list item, first item, links when visited, etc.

  • Specificity: How to handle conflicting stylesheet rules.

  • Flexbox: Introduction

  • Flexbox direction and wrapping

  • Flexbox content gaps and alignment

  • Flexbox direction and wrapping

  • Flexbox growing, shrinking, basis, and ordering of elements.

  • Coming Soon:

  • CSS Grid

  • Fluid fonts like EM’s VH, etc…

  • Border images

  • CSS Reset

  • CSS Animations

  • Bootstrap

  • Course Curriculum

    Chapter 1: Introduction

    Lecture 1: Introduction

    Lecture 2: Install VSCode Mac

    Lecture 3: Install VSCode Windows

    Lecture 4: Install Sublime Text – Mac

    Lecture 5: Install Sublime Text – Windows

    Lecture 6: Learn to Code Tip: Isolate the Issue

    Lecture 7: Source Code & Project Setup

    Lecture 8: Project Folders Renamed

    Chapter 2: Updated HTML & CSS Basics

    Lecture 1: HTML Hello World

    Lecture 2: CSS Style Sheets

    Lecture 3: Classes & IDS in CSS

    Lecture 4: Basics of CSS Specificity

    Lecture 5: Border, Margin, and Padding in HTML & CSS

    Lecture 6: Chrome Dev Tools for Debugging HTML & CSS

    Lecture 7: CSS Combinators

    Lecture 8: Display Types: Block, inline, inline-block

    Lecture 9: CSS Positioning: Static, Sticky, Relative, Absolute

    Lecture 10: Margin Collapsing in HTML & CSS

    Lecture 11: HTML Color Codes

    Lecture 12: Media Queries

    Lecture 13: Pseudo Classes

    Lecture 14: Styling HTML Forms

    Lecture 15: Custom CSS Properties

    Lecture 16: CSS Animation Basics

    Lecture 17: EMS, REMS, and Pixels

    Lecture 18: VH & VW – Viewport Height & Viewport Width

    Lecture 19: CSS Before & After

    Lecture 20: Negative Margins

    Chapter 3: Updated FlexBox

    Lecture 1: Flexbox Basics

    Lecture 2: Flexbox Align Items

    Lecture 3: Flex Direction & Wrapping

    Lecture 4: Flex Grow, Shrink, Order, Basis

    Lecture 5: Flex Align-self & content gaps

    Chapter 4: CSS Grid

    Lecture 1: Note about source files

    Lecture 2: Simple CSS Grid

    Lecture 3: Rows & Columns Start & End CSS Grid

    Lecture 4: Implicit Grid in CSS

    Lecture 5: Naming Grids in CSS

    Lecture 6: CSS Grid Ordering

    Lecture 7: CSS Grid Alignment

    Lecture 8: CSS Grid Min Max

    Chapter 5: HTML & CSS Extras

    Lecture 1: break class Rows & Columns in Flexbox

    Lecture 2: class row and column FlexBox

    Chapter 6: Beginner HTML & CSS Project

    Lecture 1: Quick note about next video

    Lecture 2: Project Intro

    Lecture 3: Buttons

    Lecture 4: Optimizing Buttons

    Lecture 5: Top Bar / Promo Bar

    Lecture 6: Navigation Bar

    Lecture 7: Responsive Navigation & Cart Icon

    Lecture 8: Hero Section

    Lecture 9: Below Hero Section

    Lecture 10: Cards

    Lecture 11: Section With Background

    Lecture 12: Top Shelf Section

    Lecture 13: Shop Items

    Lecture 14: Founder Message

    Lecture 15: Footer & Hover Effects

    Lecture 16: CSS Code Cleanup

    Instructors

  • HTML CSS Learn to Build Responsive Websites  No.2
    John s Curry
    Professional GraphQL & React Developer
  • Rating Distribution

  • 1 stars: 0 votes
  • 2 stars: 0 votes
  • 3 stars: 0 votes
  • 4 stars: 0 votes
  • 5 stars: 0 votes
  • Frequently Asked Questions

    How long do I have access to the course materials?

    You can view and review the lecture materials indefinitely, like an on-demand channel.

    Can I take my courses with me wherever I go?

    Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!