Online Class: Introduction to CSS

no certificate
- OR -
with CEU Certificate*
Start Right Now!
Taking multiple courses? Save with our platinum program.
  • 12
  • 14
    Exams &
  • 1,919
    have taken this course
  • 11
    average time
  • 1.1

Course Description

Ever wonder how the latest website designs are made? Cascading Style Sheets (CSS) are the main coding files used to lay out a website and its design. CSS3 is the latest in styling standards, and it brings several new properties and declarations you can use to make your website design more easily created. CSS is currently the only standard in website design that plugs directly into your HTML, even the latest HTML5 standards. With CSS3 and HTML5, you can create the latest interactive pages for your website viewers. 

This course shows you how to design web pages and create CSS classes from a beginner's level to a more intermediate level. It starts off with basic HTML declarations, properties, values and how to include a CSS style sheet with your HTML code. For those of you who are new to CSS and HTML, we show you step-by-step how to create a CSS file and include it in your HTML code, even if you use a cloud server for your hosting.

We show you how to position your elements, lay out your elements relative to your documents, and style your HTML using predefined CSS values. We introduce you to the common CSS styling that you'll need when you start off designing your pages. If you want to get to know CSS and website design, this course is meant for you, and it can be used by anyone who hasn't even seen one line of CSS code yet. We focus on the latest CSS 3 and HTML5 standards, so you get the latest when coding your website pages instead of focusing on older code.

Whether you're a simple HTML coder or an advanced backend coder that provides dynamic web pages, you need CSS. Cascading Style Sheets (CSS) provide these web pages with a look and feel for the web page that displays to the user. In general, CSS files are the layout and design for a web page. From the placement of images and text to the font size and background color, CSS controls the way these HTML elements display in a browser.

What is CSS?

You know that CSS files contain styles in a web page, but what are web element styles and how do they fit in with HTML? CSS is designed to solve a problem of styling.

When HTML and websites began to be more public in the 1990s, old style web pages used HTML to change the font size and color, the background of a page, or display images. HTML was never intended to format pages, but technology evolved and developers needed a way to make HTML pages prettier. Not only did developers need a way to style pages, but they also needed a way to make code cleaner and dynamic. After initial versions of HTML, newer versions introduced styling elements such as the paragraph element <p> or the font element <font>. These elements formatted text a bit for better layouts.

As HTML became more advanced, these elements began to grow and create bulky, hard-to-read code that wasn't easily managed. When a company decided to change its website styling, developers had to go from page to page to change the style HTML tags. You can imagine how time consuming and difficult this can be when you have thousands or even just a few dozen pages.

The answer to the impending code problem was CSS styling. CSS files allowed coders to create style classes and dynamic layouts. These styles are stored in one file, and they can be applied to all pages. One CSS file can provide styles and layouts for thousands of pages.

Why Use CSS?

CSS solves many of the styling problems coders faced in the early days of HTML. CSS has become much more advanced, but initially CSS made life easier for website designers.

There are three main advantages of using CSS.

  • You can stop using duplicate HTML tags and repetitive HTML code.

  • Changing styles and redesigning pages is much more efficient since you only need to change these styles in one file instead of all your HTML files.

  • Maintaining changes are easier since you have one style file instead of multiple

Imagine you have 10 files for your web pages. You only use HTML tags and no CSS. When you want to make changes to your fonts, you simply change the class in the CSS file instead of going to each of your font tags and change the layouts. When you make a change in the CSS class file, the changes propagate to each of your 10 HTML pages without you changing any of them manually. When you back up your files, you only need to back up one file for all of your styles.

  • Completely Online
  • Self-Paced
  • Printable Lessons
  • Full HD Video  
  • 6 Months to Complete
  • 24/7 Availability
  • Start Anytime
  • PC & Mac Compatible
  • Android & iOS Friendly
  • Accredited CEUs
Universal Class is an IACET Accredited Provider

Course Lessons

Average Lesson Rating:
4.5 / 5 Stars (Average Rating)
"Extraordinarily Helpful"
(697 votes)

Lesson 1: Introduction to CSS: Why Use CSS?

CSS files are the layout and design for a web page. From the placement of images and text to the font size and background color, CSS controls the way these HTML elements display in a browser. Additional lesson topics: HTML5 and CSS: Introductory; HTML and CSS: Design and Build Websites 12 Total Points
  • Lesson 1 Video
  • Lesson discussions: Reasons for Taking this Course
  • Complete Assignment: Motives for Taking this Course
  • Assessment: Exam 1

Lesson 2: CSS Syntax

This lesson focuses on CSS selectors, properties, values and different basic declarations you need to make basic CSS classes and styles. Additional lesson topics: CSS Syntax; The Several CSS Selectors you Must Memorize 10 Total Points
  • Lesson 2 Video
  • Assessment: Exam 2

Lesson 3: HTML 5 and CSS

The latest version of HTML is HTML 5, which has changed the face of web page design. The latest version of CSS is CSS 3. Both of these versions work together to create interactive desktop applications that work on both a desktop browser and a mobile brows Additional lesson topics: CSS Tricks-box- shadow; Using CSS gradients 9 Total Points
  • Lesson 3 Video
  • Assessment: Exam 3

Lesson 4: Setting Up Web Pages with CSS

This lesson will cover some basics of inserting CSS classes in your coding projects. Additional lesson topics: Three Ways to Insert CSS 10 Total Points
  • Lesson 4 Video
  • Assessment: Exam 4

Lesson 5: Styling Text, Font, and Properties

Having some knowledge in font layouts and design and knowing how to work with these designs in CSS will help you when you design your pages. Additional lesson topics: Font Properties; CSS Properties 10 Total Points
  • Lesson 5 Video
  • Assessment: Exam 5

Lesson 6: Styling Page Backgrounds

You can use a color, a gradient, or even an image for your background. When you set your background, the entire page is set with the color or image and any layers or elements overlap the background. Additional lesson topics: Perfect Full Page Background Image CSS-Tricks 10 Total Points
  • Lesson 6 Video
  • Assessment: Exam 6

Lesson 7: Styling Lists in CSS

Lists (both bullet points and numbered) have been a part of HTML code for ages. What’s new about lists is the way you can stylize them for your users in CSS. Additional lesson topics: 5 Simple and Practical CSS List Styles You Can Copy and Paste; Multiple Class / ID and Class Selectors CSS Tricks 10 Total Points
  • Lesson 7 Video
  • Assessment: Exam 7

Lesson 8: Using CSS Classes and IDs

CSS lets you use inheritance, which means that objects or styles can “inherit” or take from their parent classes. Additional lesson topics: CSS Classes vs ID Tutorial 9 Total Points
  • Lesson 8 Video
  • Assessment: Exam 8

Lesson 9: Using Borders and Height and Width CSS Properties

When newer styles of CSS and HTML were introduced, the hassle of borders was remedied and now designers can use premade CSS classes to create a border around an HTML element. Additional lesson topics: Box Sizing CSS Trick; CSS Box Model 10 Total Points
  • Lesson 9 Video
  • Assessment: Exam 9

Lesson 10: CSS Pseudo Elements

CSS not only lets you control styles of an element, but it also lets you control styles for parts of an element. Additional lesson topics: CSS Pseudo-elements; A Whole Bunch of Amazing Stuff Pseudo Elements Can Do- CSS Tricks 10 Total Points
  • Lesson 10 Video
  • Assessment: Exam 10

Lesson 11: Positioning Elements

In this lesson, we’ll learn how to work with tableless designs, position elements, floating styles, margins and padding, and other aspects of creating layouts that fit a page width and height. Additional lesson topics: CSS Positioning; Learn CSS Positioning in Ten Steps 10 Total Points
  • Lesson 11 Video
  • Assessment: Exam 11

Lesson 12: Validating CSS and HTML

After you finish your CSS and HTML design, you need to validate it in some way. There are several validation tools on the market across the web. 67 Total Points
  • Lesson 12 Video
  • Lesson discussions: What is your opinion of this course?; Program Evaluation Follow-up Survey (End of Course)
  • Assessment: Exam 12
  • Assessment: Final Exam
Total Course Points

Learning Outcomes

By successfully completing this course, students will be able to:
  • Define CSS.
  • Demonstrate using basic CSS syntax.
  • Demonstrate set up web pages with CSS.
  • Demonstrate using CSS for styling text, font, and properties.
  • Demonstrate using CSS for styling page backgrounds.
  • Demonstrate styling lists in CSS.
  • Demonstrate using CSS classes and IDs.
  • Demonstrate using borders and height and width CSS properties.
  • Demonstrate using CSS pseudo elements.
  • Demonstrate positioning elements with CSS.
  • Demonstrate validating CSS and HTML.
  • Demonstrate mastery of lesson content at levels of 70% or higher.

Additional Course Information

Online CEU Certificate
  • Document Your Lifelong Learning Achievements
  • Earn an Official Certificate Documenting Course Hours and CEUs
  • Verify Your Certificate with a Unique Serial Number Online
  • View and Share Your Certificate Online or Download/Print as PDF
  • Display Your Certificate on Your Resume and Promote Your Achievements Using Social Media
Document Your CEUs on Your Resume
Course Title: Introduction to CSS
Course Number: 8900324
Lessons Rating: 4.5 / 5 Stars (697 votes)
Languages: English - United States, Canada and other English speaking countries
Course Type: Self-Paced, Online Class
CEU Value: 1.1 IACET CEUs (Continuing Education Units)
CE Accreditation: Universal Class, Inc. has been accredited as an Authorized Provider by the International Association for Continuing Education and Training (IACET).
Grading Policy: Earn a final grade of 70% or higher to receive an online/downloadable CEU Certification documenting CEUs earned.
Assessment Method: Lesson assignments and review exams
Syllabus: View Syllabus
Course Fee: $75.00 U.S. dollars

Choose Your Subscription Plan

Course Only
One Course
No Certificate / No CEUs
for 6 months
Billed once
This course only
Includes certificate X
Includes CEUs X
Self-paced Yes
Instructor support Yes
Time to complete 6 months
No. of courses 1 course
Certificate Course
One Course
Certificate & CEUs
for 6 months
Billed once
This course only
Includes certificate Yes
Includes CEUs Yes
Self-paced Yes
Instructor support Yes
Time to complete 6 months
No. of courses 1 course
Platinum Yearly
Best Value
Certificates & CEUs
per year
Billed once
Includes all 500+ courses
Includes certificate Yes
Includes CEUs Yes
Self-paced Yes
Instructor support Yes
Time to complete 12 Months
No. of courses 500+
Platinum Monthly
Certificates & CEUs
$69 first month
$29.00 / each consecutive month thereafter
Billed monthly
Includes all 500+ courses
Includes certificate Yes
Includes CEUs Yes
Self-paced Yes
Instructor support Yes
Time to complete Monthly
No. of courses 500+