Css Background Properties

CSS Background Properties:

CSS provide several properties for styling the background of an element, like: background-color, background-image, background-repeat, background-attachment and background-position. The following section will describe you how to use these properties to set the different styles for the backgrounds one by one.

• i). Background Color
• ii). Background Image
• iii). Background Repeat
• iv). Background Attachment
• v). Background Position

---

i). Background Color

The background-color property is used to set the background color of an element,tag or any specified attribute

Try This

Output :

	
This is a heading
    
This is a paragraph.

---

ii). Background Image:

Background Image property is used to set the background image of an element,tag or any specified field.

Example :

Try This

Output :

This is a heading
This is a paragraph.
	

---

iii). Background Repeat :

By default the background-image property repeats an image both horizontally and vertically.

y using background-repeat property you can control how a background image is tiled in the background of an html element. You can set a background image repeat vertically (y-axis), horizontally (x-axis), in both directions, or in neither direction.

Example :

Try This

Output :

   
This is a heading
   
This is a paragraph.

---

iv). Background Attachment :

The background-attachment property determines whether the background image is fixed with regard to the viewport or scrolls along with the containing block.

Example :

Try This

Output :

Background Position :

background-position is used to set the positon of the backgroung image, it helps you to fix the position of the images as per your wish.

If no background-position has been specified, the image is placed at the default top-left position of the element:

Example :

Try This

Output :

	
Hello World!
	
An Engineering portal for Programming Languages. It contains well written,
 easy explained,HTML,CSS, JavaScript,DOM, jQuery, PHP, SQL, XML, Bootstrap, Web,marquees,
images,links,tables, frames,lists, layouts, colors, forms, backgrounds, style sheet, 
articles, quizzes, practices, certification, development, training, learning, lessons,
examples,source code,colors,demos,tips,c,c++,sql,visual basic,sql examples,
vb examples,JAVA Tutorials, JAVASCRIPT Tutorials,C++ Tutorials,
 C languages Tutorials, VISUAL BASIC  Tutorials, SQL Tutorials,aimtocode, aimtocode.com