W3.CSSLesson 20Free preview

W3.CSS Colors

This lesson is part of W3.CSS · All levels

Summary

It provides a ready-to-use color class for background, text, and hover states, so you don't have to memorize hex codes. For example w3-red for background, w3-text-red for text, and w3-hover-blue when cursor over element. There are also pale variants like the soft w3-pale-yellow for the card and message backgrounds. (W3.CSS)

Key points

Basic class colors such as w3-red, w3-blue, w3-green, and w3-black set the background
W3-text-<color> change the color text without changing the background
W3-hover-<color> changes color when the state of hover
The pale variants such as w3-pale-yellow are suitable for a soft background
Custom color can still be written using attribute style with hex or rgb

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.