HTML and CSS Reference
In-Depth Information
1. .btn {
2. font-size: 16px;
3. }
4. .btn-danger {
5. background: red;
6. }
7. .btn-success {
8. background: green;
9. }
Here you can see two anchor elements, both with multiple class attribute values. The first
class, btn , is used to apply a font size of 16 pixels to each of the elements. Then, the first
anchor element uses an additional class of btn-danger to apply a red background col-
or while the second anchor element uses an additional class of btn-success to apply a
green background color. Our styles here are clean and modular.
Using multiple classes, we can layer on as many styles as we wish, keeping our code lean
and our specificity weights low. Much like understanding the cascade and calculating spe-
cificity, this is a practice that will take time to fully absorb, but we'll get better with each
Common CSS Property Values
We've used a handful of common CSS property values already, such as the keyword color
values of red and green . You may not have thought too much about them; that's okay.
We're going to take time now to go over some previously used property values as well as
to explore some of the more common property values that we'll soon be using.
Specifically, we'll look at property values that relate to colors and length measurements.
All color values within CSS are defined on an sRGB (or standard red, green, and blue) col-
or space. Colors within this space are formed by mixing red, green, and blue color channels
together, mirroring the way that televisions and monitors generate all the different colors
they display. By mixing different levels of red, green, and blue, we can create millions of
colors—and find nearly any color we'd like.
Currently there are four primary ways to represent sRGB colors within CSS: keywords,
hexadecimal notation, and RGB and HSL values.
Search WWH ::

Custom Search