Background – Shorthand property
All of us like shortcuts so instead of writing a huge block of code as seen below
p { background-color: #ff00ff; background-image: url("myimage.png"); background-repeat: no-repeat; background-position: right top; }
We can write it as
p{ background: #ffffff url("myimage.png") no-repeat right top; }
Complete example
<!DOCTYPE html> <html> <head> <style> body { background: #ffffff url("myimage.png") no-repeat right top; } </style> </head> <body> <h1>The background shorthand property</h1> <p>The background property is a shortcut way of specifying all the background properties in one declaration.</p> <p>Here, the background image is shown once, and is positioned at the top-right corner.</p> </body> </html>