What is the difference between Property in css, background-origin and background-clip?

Asked

Viewed 79 times

-1

Well I know what the two properties are for but I don’t know the difference between the two because they both use the same values and contain the same results in the viewport!

css3

1 answer

2

Compare these examples: background-origin and background clip

Note that the background-origin defines the position of the image, and the background-clip how far she can if extend.

  • The background-origin works only with images, while background-clip works also with colors.
  • The background-origin, when used without the property background-repeat: no-repeat, makes the image fill the whole element, which does not happen if you use the background-clip, where it does control how far it is filled.
  • There is a mutually exclusive attribute value of background-clip called text, that makes the image/color "extend" within the text only (as in the example).

Those are probably not the only differences, I just mentioned a few that I noticed. These differences are most noticeable when you use them in elements instead of the whole page body.

I recommend reading this reply another question, which makes comparisons with the values of the attributes.

  • valeu gave a good idea

Browser other questions tagged css3

You are not signed in. Login or sign up in order to post.