HTML and CSS Tutorial for beginners

Follow these step-by-step tutorials to master HTML and CSS.
3.9 (20 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
962 students enrolled
$19
$20
5% off
Take This Course
  • Lectures 108
  • Length 7 hours
  • Skill Level Beginner Level
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 1/2016 English

Course Description

Every website you visit at a basic level is constructed with HTML and CSS. So these two languages are the first and most essential languages you will want to learn and begin with for web development. This course will teach you all the essentials of HTML and CSS. You will learn all about HTML tags, elements, and HTML structure. You will also learn about how to edit the HTML document as well as create HTML web forms. This course uses the latest concepts in HTML5. We will then move on to CSS and how to style your web pages. We will then wrap up the course with a full CSS layout tutorial.

I firmly believe it is important to understand the core concepts to any language. And so this course will stress concepts first and foremost.

In this HTML and CSS Tutorial for Beginners course, you will learn how to make high-quality, well structured and thoroughly impressive web sites. You will also gain a strong understanding of CSS concepts that will allow you to code your website exactly the way you want it to look. So in every sense this is a comprehensive HTML and CSS course. This HTML and CSS Tutorial for Beginners is perfect for both beginners and web designers who want to freshen up their skills.

Watch hours of engaging video lectures, and study all the code examples that will be provided. With this course, you will become fully competent in CSS and master beginning web site design!

What are the requirements?

  • The only requirement is any text editor.
  • PC, Mac or Linux PC
  • Web Browser

What am I going to get from this course?

  • Understand the basics of HTML.
  • The HTML Document Structure For HTML
  • Text Markup
  • HTML elements
  • CSS
  • CSS Layout

What is the target audience?

  • People who want to learn the basics of web design.

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: HTML Basics - The element and structure
04:05

In this video lecture we will examine the most basic unit of HTML, the element.

04:11

In this video lecture we will examine the Basic Document Stucture used in HTML.

09:57

In this video we go over the basic structure of HTML and create our

first web page.

06:25

In this video we go over adding line breaks, spacing, and comments to your HTML code.

04:00

In this video we go over ordered and unordered lists

04:08

In this video we review HTML tables.

Creating a web link
01:58
04:11

Setting up links on same web page.

01:38

In this video we go over adding a image to a web page.

03:08

We go over sizing an image on your web page.

01:20

In this video we review nested elements.

03:47

In this video we go over HTML forms - the one-line text box.

02:52

In this video we add a label to our text box.

02:29

In this video we will create a multi-line text box.

02:25

In this video we will create a radio button.

01:27
In this video we will create a checkbox.
01:36
In this video we will create a number input box.
02:26

In this video we will create a drop-down list.

02:38
In this video we will create a date and number box.
02:58

In this video we go over the HTML attribute.

04:04

In this video we go over the meta element.

02:02
In this video we go over whitespace and escape characters.
02:44
In this video we will discuss the bold and italic elements
05:07
In this video we will discuss the iframe element
01:41

In this video we go over sup and sub elements.

02:25

In this video we cover the Title and Alt attributes.

02:56

In this video we cover the audio element.

02:15

Audio Element attributes.

01:49

In this video we cover the video element in HTML 5.

01:17

In this video we go over doctype.

HTML Practice Quiz
8 questions
Section 2: CSS
05:39

In this video we go over the basic structure of CSS.

04:05

In this video we go over changing font type and color

01:52
In this video we go over how to write rule for more than one element.
01:36
In this video we go over how to add line to header element.
04:28
In this video we go over how inheritance works in CSS
04:10
In this video we go over how classes works in CSS
03:28
In this video we continue on with classes in CSS
03:15
In this video we take a look at the font family CSS property.
02:07

In this video we take a look at the font weight property.

05:02

In this video we take a look at the external style sheet.

01:56
In this video we take a look at the text-decoration property.
03:34

In this video we take a look at Italic text

05:14

In this video we take a look at adding colors in CSS Web Colors

02:47
In this video we take a longer look at inline style.
05:26

In this video we take a longer look at font sizes.

01:53

In this video we take a look at line height property.

03:47
In this video we take a look at the CSS Box Model.
06:18

In this video we continue on with the CSS Box Model.

05:26

In this video we continue on with the CSS Box Model.

04:45

In this video we continue on with the CSS Box Model.

02:01

In this video we take a look at the Background image property.

04:39

In this video we take a look at the ID attribute.

01:10

In this video we take a look at the text align property.

02:35

In this video we take a look at the border property.

03:48

In this video we take a look at the border property.

06:14

In this video we take a look at the DIV element.

03:49

In this video we take a look at the SPAN element.

05:03

In this video we add a content page and reuse some of our CSS classes.

05:22

In this video we add some special effects to our web page.

09:17

In this video we take a look at block and inline elemnts.

04:08

In this video we take a look at block and inline elements and how they relate to the CSS box model.

02:28

In this video we take a look at block and inline elements and and how they can be converted.

04:45

In this video we take a look at floating elements.

02:54
In this video we take a look at using absolute positioning.
02:24

In this video we take a look at using fixed positioning.

02:08

In this video we go over the CSS overflow property.

02:08

In this video we go over the CSS cursor property.

01:53

In this video we go over how to add a custom cursor.

04:44

In this video we go over aligning text and images in same div.

10:00

In this video we go over relative positioning.

07:10
In this video we go over a vertical menu.
02:07

In this video we continue with the vertical menu.

05:30

In this video we look at the horizontal menu.

04:58
In this video we look at button design.
03:15

In this video we look at setting the display property to inline-block.

05:07

In this video we start to design a web form.

06:50

In this video we add CSS to the web form. Alignment is key with forms.

04:22

In this video we review selectors.

03:42

In this video we review selectors.

03:29

In this video we review selectors.

03:12

In this video we review selectors.

04:35

In this video we review attribute selectors.

03:16
In this video we review the nth child selectors.
02:52

In this video we review the not selector.

CSS Practice Quiz
10 questions
Section 3: CSS Graphics
03:20
In this video we review the opacity property.
06:01

In this video we review linear gradients.

04:02
In this video lets combine opacity and gradient.
Text-shadow
04:46
02:58

In this video lets review the box shadow property.

Section 4: CSS Layout
Introduction to layouts
Preview
01:25
05:33

In this video we go start with the body.

05:25

In this video we will add the header and navigation bar.

05:37

In this video we will add the main section.

08:46

In this video we will add the sidebar.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Ernest Jones, Computer Programming

I am in the computer industry and have done many tutorials on computer programming. Some of my tutorials are among the most viewed on several different website. All of my videos are explained in an easy step-by-step manner. I have done tutorials on ASP, CSS, HTML, Java, JavaScript, and PHP.

Ready to start learning?
Take This Course