CSS Backgrounds and Borders
Styles in the CSS Backgrounds and Borders module allow filling backgrounds with color or an image (clipped or resized), or modifying them in other ways. These styles can also decorate borders with lines or images, and make them square or rounded. (Additionally, element boxes can be decorated with a shadow.)
Reference
CSS Properties
background
background-attachment
background-clip
background-color
background-image
background-origin
background-position
background-position-x
background-position-y
background-repeat
background-size
border
border-bottom
border-bottom-color
border-bottom-left-radius
border-bottom-right-radius
border-bottom-style
border-bottom-width
border-collapse
border-color
border-image
border-image-outset
border-image-repeat
border-image-slice
border-image-source
border-image-width
border-left
border-left-color
border-left-style
border-left-width
border-radius
border-right
border-right-color
border-right-style
border-right-width
border-style
border-top
border-top-color
border-top-left-radius
border-top-right-radius
border-top-style
border-top-width
border-width
box-shadow
Tools
- Using multiple backgrounds
-
Explains how to set one or more backgrounds on an element.
- Resizing background images
-
Describes how to change the size and repeating behavior of background images.
- Applying color to HTML elements using CSS
-
An overview of how CSS color can be used in HTML, including for borders.
- Border-image generator
-
This interactive tool lets you visually create border images (the
border-image
property). - Border-radius generator
-
This interactive tool lets you visually create rounded corners (the
border-radius
property). - Box-shadow generator
-
This interactive tool lets you visually create shadows behind elements (the
box-shadow
property).
Specifications
Specification |
---|
CSS Backgrounds and Borders Module Level 4 |