Introducing CSS

Hello there! Today, we are venturing into an exploration of CSS (Cascading Style Sheets), a language that contributes endlessly to bringing color, life, and structure to webpages. Think about this: once you have constructed a building with bare walls with HTML, CSS becomes the tool that paints the walls, decorates the room, and makes it cozy. Amazing, isn't it? Let's dive in!

Basic Syntax of CSS

The syntax of CSS is similar to writing commands for your dog — you choose the dog's name (selector), and then tell it what to do (declarations). For instance, let's create a CSS rule-set:

In this example, h1 is the selector (our pet), color and font-size are the properties (commands), and blue and 12px are the corresponding values that indicate how to perform the command. This code makes all <h1> elements have a blue text that is 12 pixels big.

Connecting CSS to HTML

There are three ways we can connect CSS to HTML:

  • Inline CSS: We apply styles directly within the HTML element using the attribute:
Sign up
Join the 1M+ learners on CodeSignal
Be a part of our community of 1M+ users who develop and demonstrate their skills on CodeSignal