在此页

• 参考
• 工具
• 规范
• 相关话题

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.)

参考

CSS 特性

• 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

工具

Using multiple backgrounds

Explains how to set one or more backgrounds on an element.

Scaling 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).

规范

规范	状态	注释
CSS Backgrounds and Borders Module Level 3	候选推荐
CSS Level 2 (Revision 1)	推荐
CSS Level 1	推荐

元数据

• 最后修改： Jul 7, 2020

相关话题

1. CSS
2. CSS 参考
3. CSS Backgrounds and Borders
4. 指南

   1. Resizing background images with background-size
   2. Using multiple backgrounds
5. 特性

   1. background
   2. background-attachment
   3. background-clip
   4. background-color
   5. background-image
   6. background-origin
   7. background-position
   8. background-position-x
   9. background-position-y
   10. background-repeat
   11. background-size
   12. border
   13. border-bottom
   14. border-bottom-color
   15. border-bottom-left-radius
   16. border-bottom-right-radius
   17. border-bottom-style
   18. border-bottom-width
   19. border-color
   20. border-image
   21. border-image-outset
   22. border-image-repeat
   23. border-image-slice
   24. border-image-source
   25. border-image-width
   26. border-left
   27. border-left-color
   28. border-left-style
   29. border-left-width
   30. border-radius
   31. border-right
   32. border-right-color
   33. border-right-style
   34. border-right-width
   35. border-style
   36. border-top
   37. border-top-color
   38. border-top-left-radius
   39. border-top-right-radius
   40. border-top-style
   41. border-top-width
   42. border-width
   43. box-shadow