Cascading style sheets cheatsheet


The Font Settings

Default Text

Font family sets the font of the text and creates backup fonts just in case the first one fails.

Font Variant: Small Cap

Font Style: Italic

Font Style: Oblique

Font Weight: 100-900. Lower Number is thinner. Default 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

Default

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

Background Color

Background Image

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

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


Text properties

Default text

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

Letter Spacing

Text Decoration

Text-Align: Right, Left, Center, Justify

Text-Indent: Lorem ipsum dolor, sit amet consectetur adipisicing elit. Incidunt reprehenderit fugit numquam similique quidem nobis magni, consectetur enim in distinctio. Cupiditate perspiciatis magni nobis minus nostrum quos iste aspernatur doloremque.

Line-Height: Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nihil ad reiciendis dicta, ducimus voluptatibus quo a labore, voluptates odio iste eum nulla temporibus sed quas laborum aliquid porro autem illo.

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. Ratione quod hic provident quibusdam dolorem, mollitia unde velit ipsa ad at culpa accusamus, dicta aliquid in doloribus, laborum libero corrupti perferendis!