Cascading Style Sheets Cheatsheet

The Font Settings

Default Text

Font Family sets the font of the text, and creates backup fonts in case the first font fails to load.

Font Variant: Small Caps

Font Style: Italic

Font Weight: 100-900. Lower numbers are thinner. Default font is 400. Bold is 700.

Font Size: Can be large, a px value, a percent value, or an em value.

Font is the shorthand option for all of the properties of font.


The Color Settings

Default Text

Color: Can be passed as a named color, rgb(), #hexadecimal, hsl(), hwb(). All use comma's inside of ().

Background Color

Background Image

There are background-repeat and background-attachment css attributes that will change how background images repeat across the screen.

Background is the shorthand option for all of the properties of background


Text Properties

Default Text

Word Spacing: Used to change the distance between words.

Letter Spacing

Text Decoration: Options are underline, overline, line-through, and none. You can also choose the type of line.

Text Align: Right, Left, Center, Justify

Text-Indent: Lorem ipsum dolor sit amet consectetur adipisicing elit. Quod nulla dignissimos, facere nemo facilis, labore itaque amet perferendis harum doloremque nobis omnis illum corporis ullam, minus incidunt fugit obcaecati quibusdam.

Line Height: Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quasi unde enim blanditiis. Quia sunt error ab optio tempore minima, officiis possimus eveniet numquam, architecto ipsam eius ratione voluptates quisquam nesciunt.

Text Shadow: X, Y, Blur, Color


Box Properties

CSS Box Model: Lorem ipsum dolor sit amet consectetur adipisicing elit. Odit illo praesentium placeat rerum voluptas possimus eligendi esse. Incidunt quam dicta, ullam id officiis veniam, quod nulla alias repellat fugit odit!