CSS Intro

CSS Intro Quiz

CSS Intro Exercise

CSS Basic

CSS Basic Quiz

CSS Basic Exercise

CSS Advance

CSS Advance Quiz

CSS Advance Exercise


CSS3 Quiz

CSS3 Exercise

CSS Properties

CSS Functions

CSS Selectors

Background Size Property in CSS

Background Size Property



The background-size property adds new functionality to CSS that allows specifying the size of the background images, using either lengths or percentages.




Its syntax is:-

< style >


background-size: auto| length| cover| contain| initial| inherit;


< /style >


Further Explanation:-


Value Description
auto  The background image is displayed in its original size
length Sets the width and height of the background image. The first value sets the width, the second value sets the height.
percentage Sets the width and height of the background image in percent of the parent element. The first value sets the width, the second value sets the height.
cover Resize the background image to cover the entire container, even if it has to stretch the image or cut a little bit off one of the edges
contain Resize the background image to make sure the image is fully visible
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Code Explanation

All Tutorials related to CSS3

All Sections related to CSS