Home » Tutorials » Basics of CSS

Cascading Style Sheets (CSS) is a simple and powerful language for adding style to web documents. This tutorial is designed to help you get a handle on CSS quickly and easily through a series of step-by-step lessons.

Get Started »

Table of Contents

Chapter 1: Introduction

In this chapter, you will learn about Cascading Style Sheets and why you should use them. Read more...

 

Chapter 2: CSS Syntax and Rules

In this chapter, you will learn the syntax and rules of the Cascading Style Sheet (CSS) language. Read more...

 

Chapter 3: Selectors

In this chapter, you will learn how to use a range of selectors, including type, class, ID, descendant, and universal. Read more...

 

Chapter 4: Applying Styles

In this chapter, you will learn the three different locations where you can place CSS code, including inline, header, and external style sheets. Read more...

 

Chapter 5: Padding, Borders, and Margins

In this chapter, you will learn about the CSS box model including margin, padding, and border. Read more...

 

Chapter 6: Backgrounds

In this chapter, you will learn how to apply a background image to the <body> element. Read more...

 

Chapter 7: Formatting Text

In this chapter, you will learn how to style text using font-family, font-size, line-height, font-style, font-weight, text-align, and color. Read more...

 

Chapter 8: Heading

In this chapter, you will learn how to style a flexible heading using font-size, font-weight, borders, padding, and background images. Read more...

 

Chapter 9: Styling Links

In this chapter, you will learn how to style links and pseudo-classes. Read more...

 

Chapter 10: Table Layout

In this chapter, you will learn how to add accessibility features to a data table, including summary, caption, <thead>, <th>, headers, and ids. Read more...

 

Chapter 11: Creating Vertical Navigation

In this chapter, you will learn how to create vertical navigation. Read more...

 

Chapter 12: Creating Horizontal Navigation

In this chapter, you will learn how to create horizontal navigation from a standard HTML list. Read more...