Css background-image property is used to set image in background for html element. Ee can set one or more than one background image for HTML element.
By default, the image is positioned at the top-left corner of an element and repeated both horizontally as well as vertically.
How to add background image in CSS?
We should provide image full path in the url() value of background-image property. Also we can sets two background images for the html element by providing url() value twi times in background-image property.
Syntax :
background-image: url();
background-repeat:no-repeat;
background-position:center;
Css background-repeat property is used to set image is repeated or not. Css background-repeat property has 4 values like repeat, no-repeat, repeat-x, repeat-y.
Also we can set background image position to left, right, center, top, bottom using background-position property .
let see below example to understand background-image property..
How to set Radial Gradient as Background Image in CSS ?
Css background-image: radial-gradient() property is used to apply radial gradient as Background Image in CSS.
Syntax :
background-image: radial-gradient(orange, blue);
background-image: radial-gradient(blue, red, green);
We can apply any color name for value of radial-gradient in background-image.
Note: Internet Explorer 9 and earlier versions do not support gradients.
Comments