Pages

Wednesday, 30 October 2013

CSS Beginners Guide part 3 - Working with Backgrounds

HI, today we are going know about CSS Backgrounds, css providing several background properties to apply to html page or to html elements, with this we can apply background color, background image to be set and mange the image positions, opacity, we can also apply multiple backgrounds also, we can manage the background X and Y repeating positions.

Apply Background Color

we can use background-color property to apply the color as a background to html page or any element, see the bellow example, we can specify a color value using byHEX value like : #ff00ff,RGB value like : rgb(255,50,0);Colorname like : green

ex:

<style>
body{background-color:#F00};
</style>

Apply image as a Background

we can apply background as a image to entire html page or any element using background-image property, by default the background is repeated and we can control repeating using background-repeat,
we can simply apply the multiple background images using separated by comma inbackground-image property see the bellow example