Get $1 credit for every $25 spent!

Create Your First Website with HTML & CSS Flexbox Bundle

Ending In:
Add to Cart - $19
Add to Cart ($19)
$800
97% off
wishlist
Courses
4
Lessons
145

What's Included

Product Details

Access
Lifetime
Content
2 hours
Lessons
36

HTML & CSS Guide: Create Your First Website in 2019

Create Webpages in an Easy Way Using HTML, CSS, Flexbox & Become a Modern Web Developer

By Luis Carlos | in Online Courses

HTML is the structural component that allows the creation of webpages and web applications. HTML is a powerful language that will help you develop a mobile application, websites, and work with other languages like JavaScript or PHP that allow you to create dynamic pages. This class is an introductory course for web development. After completing this class you'll be able to create a static content page to deepen your knowledge of HTML. You'll also learn the main concepts and syntax of CSS and some of the most used properties used in CSS.

  • Access 36 lectures & 2 hours of content 24/7
  • Learn some of the tags used in version 5 of HTML to format text
  • Know the main structure of an HTML document
  • Add CSS codes to your webpage
  • Learn advanced CSS (flexbox)

Instructor

Luis Carlos is a Telecommunications Engineer with experience as a trainer in mathematics, computer science, and web development, having participated in many projects directed to students. Several years of training helped him developed many skills. Transmitting knowledge and contribute to the personal development of each people is his goal on courses.

Important Details

  • Length of time users can access this course: lifetime
  • Access options: web & mobile streaming
  • Certification of completion included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Updates included
  • Experience level required: beginner

Requirements

  • PC or Mac
  • Code editor software
  • Internet access required

Course Outline

  • Getting Started With HTML
    • Code editor - 1:46
    • Html document structure - 2:24
    • Html elements - 1:39
    • Html attributes - 1:42
  • Create and Format Text
    • Create headings in your page - 3:05
    • Insert paragraphs - 3:13
    • Html text formatting - 4:34
  • Lists, Images, Hyperlinks and More
    • Create lists - 2:18
    • Html Images - 2:23
    • Html Tables - 2:52
    • Insert Hyperlinks - 4:46
  • Styles, Forms and Comments
    • Code Comments - 1:43
    • Insert Styles in Your Page - 2:58
    • Html forms - Part 1 - 5:43
    • Html forms - Part 2 - 2:59
  • HTML Multimedia Elements
    • Introduction to Multimedia - 0:48
    • Html video tag - 2:57
    • Insert Audio File in Your Webpage - 2:02
    • Html object tag - 1:40
    • Html embed tag - 1:25
    • Youtube Videos Using Iframe Tag - 3:13
    • Insert Youtube Playlist in Your Webpage - 2:54
  • Introduction to CSS
    • Introduction - 1:48
    • Css main syntax - 3:16
    • Class and Id selectors to identify elements - 6:35
    • How to add a style sheet - Internal, external and inline CSS styles - 8:27
    • How CSS Box model works - Border, margin and padding properties - 8:25
    • Css font properties - 6:51
    • Text properties - 5:04
    • Block and Inline Elements (Div and Span elements) - 5:42
    • Position Property to change elements position in your layout - 9:47
    • Float and Clear properties to position layout elements - 7:02
    • Relative and Absolute Units - 14:56
    • Define elements size using Width and Height Properties - 5:23
  • CSS Projects
    • Project - Web gallery using Float property - 13:44
    • Create a Form with HTML & CSS - 16:49

View Full Curriculum


Access
Lifetime
Content
3 hours
Lessons
51

CSS Flexbox: Learn & Build Responsive Websites in 2019

Learn Advanced HTML, CSS3 Flexbox, Bootstrap Flex, Media Queries, jQuery & Create Websites with Responsive Design

By Luis Carlos | in Online Courses

Are you looking for a course to build a modern website in the easiest and most efficient way? If your answer is yes, you're in the right place. Here you will learn how to build responsive and modern websites using the flexbox layout model. CSS Flexbox simplifies complexity. With Flexbox you will be able to do more with layouts, allowing you to reach more complex layouts in an easier and fun way that requires less code.

  • Access 51 lectures & 3 hours of content 24/7
  • Understand & correctly use the flexbox properties used for flex container and flex items
  • Know the use of media queries & flexbox properties for responsive web design
  • Use CSS3 properties to create animation & effects
  • Optimize code w/ shorthand properties

Instructor

Luis Carlos is a Telecommunications Engineer with experience as a trainer in mathematics, computer science, and web development, having participated in many projects directed to students. Several years of training helped him developed many skills. Transmitting knowledge and contribute to the personal development of each people is his goal in courses.

Important Details

  • Length of time users can access this course: lifetime
  • Access options: web & mobile streaming
  • Certification of completion included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Updates included
  • Experience level required: all levels

Requirements

  • Basic knowledge of HTML, CSS, Bootstrap & jQuery
  • Computer & code editor

Course Outline

  • Introduction
    • Course Structure & Kick off - 2:41
    • Introduction - 2:55
    • Flexbox Layout Model - 3:26
  • Create Overall Layout With Parent Properties
    • Introduction - 1:48
    • Display - 3:59
    • Flexbox! What is the default behavior? - 3:38
    • Define container direction using Flex-direction - 4:19
    • Wrap items using Flex-wrap - 3:26
    • Shorthand Flex-flow property - 1:59
    • Justify-content aligment property - 3:49
    • Align-items - 4:22
    • Align-content - 3:26
  • Flex Item Properties to Fine Tune Layout
    • Define flex items order with Order property - 3:21
    • Flex-grow - 4:55
    • Flex-shrink - 2:29
    • Flex-basis - 2:07
    • Flex shorthand property - 4:32
    • Align-self - 2:43
  • Create your First Layout with Flexbox
    • Introduction - 0:56
    • Holy Grail layout - Create your first real layout (1st version) - 5:22
    • Holy Grail with Nested Flex Containers (2nd version) - 2:09
    • Holy Grail Layout - header content - 5:35
    • Holy Grail Layout - nav content - 2:32
    • Holy Grail Layout - article content - 3:05
    • Holy Grail Layout - aside content - 1:42
    • Holy Grail Layout - footer content - 2:08
    • Advanced Layout Technique - Part 1 - 4:43
    • Advanced Layout Technique - Part 2 (Holy Grail) - 3:22
  • Responsive Design & Media Queries
    • Introduction and importance of Media Queries - 6:05
    • Responsive Design without Media Queries (With Flex-Wrap) - 2:57
    • Make your Webpage with Responsive Layout (Holy Grail Layout) - 4:35
  • Page content Made With Flexbox for real world
    • Introduction - 0:37
    • Responsive Web Gallery (Part 1) - Plan and define the main elements - 5:01
    • Responsive Web Gallery (Part 2) - Fine-tune your layout - 6:41
    • Responsive Form built with Flexbox (Part 1) - 8:37
    • Responsive Form built with Flexbox (Part 2) - Change elements order - 3:16
    • Dynamic Navigation Menu / Image accordion slider (Part 1) - Layout Creation - 6:53
    • Dynamic Navigation Menu / Image accordion slider (Part 2) - Tuning Layout - 5:51
  • Mini Projects With Flexbox & Jquery - Add Interactivity
    • Introduction - 0:35
    • Create a FAQS Page with Flexbox & Jquery - 9:56
    • Create Section Tabs Using Jquery - 12:41
  • Flexbox Model with Bootstrap Framework
    • Bootstrap Flex Intro - 1:40
    • Bootstrap display utility classes and use of Breakpoints for responsive design - 7:21
    • Flex direction - 2:27
    • Flex wrap using bootstrap - 2:28
    • Justify Content - 2:18
    • Align Items - 2:11
    • Align Content - 2:28
    • Align Self - 2:16
    • Order property applied with Bootstrap - 2:40
    • Flex Grow/Shrink utility classes - 4:14

View Full Curriculum


Access
Lifetime
Content
3 hours
Lessons
51

HTML & CSS Flexbox: Learn & Build Responsive Websites

Create Pages with Different Kinds of Content Using the Flexbox Model

By Luis Carlos | in Online Courses

Are you looking for a course to build a modern website in the easiest and most efficient way? If your answer is yes, you're in the right place. Here, you will learn how to build responsive and modern websites using the flexbox layout model. The course has 6 sections focusing on the use of the flexbox model to create websites and customize them to adapt on various devices. Using the flexbox model, you'll show the great capacity that this model has for creating multiple web content.

  • Access 51 lectures & 3 hours of content 24/7
  • Understand & correctly use the flexbox properties used for flex container and flex items
  • Create, position & align layout content
  • Know the default behavior of the flexbox model
  • Create interactive pages using Jquery

Instructor

Luis Carlos is a Telecommunications Engineer with experience as a trainer in mathematics, computer science, and web development, having participated in many projects directed to students. Several years of training helped him developed many skills. Transmitting knowledge and contribute to the personal development of each people is his goal on courses.

Important Details

  • Length of time users can access this course: lifetime
  • Access options: web & mobile streaming
  • Certification of completion included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Updates included
  • Experience level required: all levels

Requirements

  • Basic knowledge of HTML, CSS, Bootstrap & jQuery
  • Computer & code editor

Course Outline

  • Introduction
    • Course Structure & Kick off - 2:41
    • Introduction - 2:55
    • Flexbox Layout Model - 3:26
  • Create Overall Layout With Parent Properties
    • Introduction - 1:48
    • Display - 3:59
    • Flexbox! What is the default behavior? - 3:38
    • Define container direction using Flex-direction - 4:19
    • Wrap items using Flex-wrap - 3:26
    • Shorthand Flex-flow property - 1:59
    • Justify-content aligment property - 3:49
    • Align-items - 4:22
    • Align-content - 3:26
  • Flex Item Properties to Fine Tune Layout
    • Define flex items order with Order property - 3:21
    • Flex-grow - 4:55
    • Flex-shrink - 2:29
    • Flex-basis - 2:07
    • Flex shorthand property - 4:32
    • Align-self - 2:43
  • Create your First Layout with Flexbox
    • Introduction - 0:56
    • Holy Grail layout - Create your first real layout (1st version) - 5:22
    • Holy Grail with Nested Flex Containers (2nd version) - 2:09
    • Holy Grail Layout - header content - 5:35
    • Holy Grail Layout - nav content - 2:32
    • Holy Grail Layout - article content - 3:05
    • Holy Grail Layout - aside content - 1:42
    • Holy Grail Layout - footer content - 2:08
    • Advanced Layout Technique - Part 1 - 4:43
    • Advanced Layout Technique - Part 2 (Holy Grail) - 3:22
  • Responsive Design & Media Queries
    • Introduction and importance of Media Queries - 6:05
    • Responsive Design without Media Queries (With Flex-Wrap) - 2:57
    • Make your Webpage with Responsive Layout (Holy Grail Layout) - 4:35
  • Page content Made With Flexbox for real world
    • Introduction - 0:37
    • Responsive Web Gallery (Part 1) - Plan and define the main elements - 5:01
    • Responsive Web Gallery (Part 2) - Fine-tune your layout - 6:41
    • Responsive Form built with Flexbox (Part 1) - 8:37
    • Responsive Form built with Flexbox (Part 2) - Change elements order - 3:16
    • Dynamic Navigation Menu / Image accordion slider (Part 1) - Layout Creation - 6:53
    • Dynamic Navigation Menu / Image accordion slider (Part 2) - Tuning Layout
  • Mini Projects With Flexbox & Jquery - Add Interactivity
    • Introduction - 0:35
    • Create a FAQS Page with Flexbox & Jquery - 9:56
    • Create Section Tabs Using Jquery - 12:41
  • Flexbox Model with Bootstrap Framework
    • Bootstrap Flex Intro - 1:40
    • Bootstrap display utility classes and use of Breakpoints for responsive design - 7:21
    • Flex direction - 2:27
    • Flex wrap using bootstrap - 2:28
    • Justify Content - 2:18
    • Align Items - 2:11
    • Align Content - 2:28
    • Align Self - 2:16
    • Order property applied with Bootstrap - 2:40
    • Flex Grow/Shrink utility classes - 4:14

View Full Curriculum


Access
Lifetime
Content
0.5 hours
Lessons
7

Responsive Web Design: Create a Landing Page for Every Device

Learn Main Concepts of Responsive Design & Create Modern Websites that Apply to All Types of Devices

By Luis Carlos | in Online Courses

It's time to learn responsive web design for a better user experience, where design and development should respond to the user’s behavior and environment based on screen size, platform, and orientation. This course teaches you how to use HTML and CSS skills/properties to create responsive websites, that work for any type of media device. It's time for the modern web, make sure your websites are ready for this evolution!

  • Access 7 lectures & 30+ minutes of content 24/7
  • Get a basic introduction to web design
  • Learn the main concepts of responsive design
  • Know how to use CSS units for flexible content
  • Create a landing page w/ flexible content

Instructor

Luis Carlos is a Telecommunications Engineer with experience as a trainer in mathematics, computer science, and web development, having participated in many projects directed to students. Several years of training helped him developed many skills. Transmitting knowledge and contribute to the personal development of each people is his goal on courses.

Important Details

  • Length of time users can access this course: lifetime
  • Access options: web & mobile streaming
  • Certification of completion included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Updates included
  • Experience level required: all levels

Requirements

  • Basic knowledge of HTML, CSS, Bootstrap & jQuery
  • Computer & code editor

Course Outline

  • Introduction
    • Introduction to responsive web design - 2:35
    • Project - 1:44
  • Importance of Relative Units
    • Relative Units (Em and Rem units) - 6:45
    • Relative Units (viewport and percentage units) - 8:25
  • Responsive Landing Page
    • Img tag vs. background-image css property - 4:56
    • Responsive design using media queries - 4:08
    • Create header and main section for a landing page - 7:18

View Full Curriculum



Terms

  • Unredeemed licenses can be returned for store credit within 15 days of purchase. Once your license is redeemed, all sales are final.
×
Your Ad Blocker Is On!
Sadly, recent updates to your Ad Blocker are preventing crucial parts of our shop from loading. Frustrating. We know. We hate to nag, but please turn off your Ad Blocker or whitelist us to continue exploring our shop.