<?xml version="1.0" encoding="utf-8"?>

CSS background-clip property

CSS background-clip property

The background-clip property defines how far the background image or color should extend within its border-box, padding-box, or content-box only.

Consider the following:

  • The border-box value extends the background to the element's borders
  • The padding-box value extends it to the inner side of borders
  • The content-box value defines the background so that it doesn't go beyond its content area

Essentially, this property has no effect if the background color or background image aren't specified.

Improve your UX & Product skills with interactive courses that actually work