Understanding Text Color and Background Color Properties

Welcome back, Navigator! Today, we'll delve into text styling with CSS. We have a sci-fi library page that's currently plain, and we're going to color it! Color is a crucial aspect of web design as it sets the visual tone of a webpage and can highlight important sections, thereby enhancing user experience.

In CSS, we use color and background-color properties to color text and backgrounds respectively. Let's see this in action:

This code snippet makes all the text in the body element of our HTML document white and gives it a black background.

Colors can be specified in several ways — Named Colors (e.g., blue), HEX Values (e.g., #c0c0c0 for silver), RGB Values (e.g., rgb(0,0,255) for blue), and HSL Values (e.g., hsl(120,100%,50%) for lime). Feel free to experiment with these methods to add some vibrancy to your webpage!

Diving into Font Styling

Next, we'll explore font styling, a key aspect for making your web content both appealing and readable.

In CSS, we adjust the text size with the font-size property, define the font with font-family, and alter text thickness using . Let's incorporate these into our previous style:

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