Cascading Style Sheets Cheatsheet

The Font Settings

Default Text

Font Family sets the font of th etext, and creates backup font incase the first one fails.

Font Variant: Small Cap

Font Style: Italic

Font Style: Oblique

Font Weight: 100-900. Lower number is thinner. Defualt is 400. Bold is 700

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

Font is shorthand for all of the properties and fonts.


The Color Settings

Defualt Text

Color: can be passed as a named color, rgb(), #hexdecimal, hsl(), hwb(). All use commas inside of ().

Background Color

Background Image

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

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


Text Properties

Defualt Text

Word Spacing: Used to change the distance between words. Measured in the same measurements as font size.

Letter Spacing

Text Decoration

Text-align: Right, Left, Center, Justify

Text-Indent: Lorem ipsum, dolor sit amet consectetur adipisicing elit. Accusamus autem amet ab doloribus eum iste earum odio, nesciunt maxime quae quia. Magnam repellat eum optio aut animi. Magni, exercitationem quam!

Line Height: Lorem ipsum, dolor sit amet consectetur adipisicing elit. Odit, recusandae accusantium? Ab aliquam alias vel a perferendis amet debitis error vitae labore reprehenderit sequi ipsa quia, ut doloribus autem aspernatur.

Text Shadow: Uses 3 values and a color. First is for X, Second is for Y, 3rd is for blur radius.


Box Properties

CSS Box Model Content: Lorem ipsum dolor sit amet consectetur adipisicing elit. Optio voluptatum nostrum asperiores, deleniti laboriosam quaerat error accusantium reprehenderit odio maiores aliquid. Consectetur porro fugit rem facere cupiditate vel ipsam illo.