Chapter 17: CSS Backgrounds

Background Color

Background Color Yellow

Background Image

Single Background Image

Multiple Background Images

Background Repeat

Repeat-X

Repeat-Y

Space

Round

No Repeat

Background Position

Right Top

Background Size

100px 100px

50% 66%

Contain

Cover

Shorthand Example

Background Clip

Default (Border-box)

Padding-box

Content-box

Background Origin

Default (Padding-box)

Border-box

Content-box

Background Attachment

Fixed Background

Local Background (scrolls with content)

CSS Gradients

Linear Gradient Top to Bottom

Linear Gradient Left to Right

Diagonal Gradient

Angle Gradient

Repeating Linear Gradient

Radial Gradient

Radial Gradient with Stops

Repeating Radial Gradient