Genies Hour (10)

CSS - Multiple Backgrounds

Know

CSS Multiple Backgrounds Properties

• background-size
• background-origin
• background-clip

                                                          What I have learned?

• Property	Description
  background	A shorthand property for setting all the background properties in one declaration
  background-clip	Specifies the painting area of the background
  background-image	Specifies one or more background images for an element
  background-origin	Specifies where the background image(s) is/are positioned
  background-size	Specifies the size of the background image(s)

                What problem do I foresee happening?

It is still quiet hard for me to remember the mixed form of background.
background:color url() repeat center/cover position;

How can I solve than now?

I try to write them out separately .

What is happening that you did not expect?
If I write the mixed form at first, I cannot write another line of single element such as following:

background:red url(./images/1.jpg) center/cover 10px 2px;

background-repeat:no-repeat;

This format won't be working .

What is the best thing that happened,why?
When I saw my codes becomes an actual website and appeared on the chrome where it is showing it's effects.