www.pickatutorial.com Computer Tutorials
Top eBooks: C/C++ | C# | Android | Mathematics | Database | Cloud | Graphics | Networking | Oracle | Hardware | AI
Top Tutorials: C/C++ | C#.NET | PHP MySQL | Java | Java Script | jQuery | HTML | xHTML | HTML5 | VB Script| CSS
Lessons CSS Colors and Backgrounds Bookmark and Share
Tutorial Home
Lesson 1
Lesson 2
Lesson 3
Lesson 4
Lesson 5
Lesson 6
Lesson 7
Lesson 8
Lesson 9

In the previous lesson we learned different methods to apply CSS styles to our HTML documents. In this lesson we will learn different CSS color and background properties.

We will learn to apply colors and background colors to our HTML documents and also look at the setting and positioning background images using CSS.

From this lesson onwards we will not be showing the complete coding of our HTML and / or CSS files. It is understood that you know HTML and hence it would be a waste of resources to show complete HTML coding of our documents. Please also note that when we refer to CSS code it is implied that the same has to be written in a .css file and the .css file has to be linked to an HTML web page for testing, using the techniques learned in the previous lesson.

CSS 'color' property

The CSS color property describes the foreground color of an element. We can use this property to color our different HTML elements, for example <h1> and <p>, etc.

Here is an example:

h1 { color: #ff0000; }

The above code would make our every <h1> element to appear in red color. Colors can be entered as hexadecimal values, shown above, as rgb values (rgb(255, 0, 0)) or we can use color names ("red").

CSS 'background-color' property

The CSS background-color property describes the background color of elements. We can use this property to control the background color of our different HTML elements, for example <h1> and <p>, etc. We can also use this property with the <body> tag to control the background color of the entire page.

Here is an example:

body { background-color: #ff0000; }

Next >>> Lesson No. 4: CSS Background Images

Home - Advertise - Contact - Disclaimer - About Us
© Since 2006 pickatutorial.com -- All Rights Reserved.