Styling Web- CSS

Cascading Style Sheets popularly known as CSS are very popular for providing a look to a web page or sometimes applications. These are generally used in combination with HTML and XHTML. How is the elements in the site going to look is decided with the CSS. 

Image credits:http://www.onbile.com/info/how-to-build-a-mobile-website/

CSS provides the beauty to a web page. Like how should be the background color of a page should be, what font style should be used and many small small things used for beautification is used with done using a CSS.

Lets study a example for better understand of CSS

I have created a block in div tag in HTML

i.e.

<div class="sample-class" id="sample">

This is a sample block

</div>

Now I want to style this block according to my requirement.

So I will define the CSS class (or may be ID) with the properties of its appearance.

<style>

.sample-class{

width:400px; //defines the width of the above block(sample-class) as 400px

height:300px; //defines the height of the above block(sample-class) as 300px

background-color:#111; //Define the background color of the block as shade of grey #111111(near to black)

color:#fff; //defines the color of the text as white (#ffffff)

}

</style>

Test this fiddle and make modification in it to learn the power of CSS http://jsfiddle.net/BfvC8/

I would highly recommend to visit this site, if people are interested in learning CSS tricks: http://css-tricks.com

For people who are interested in learning CSS from scratch: http://www.w3schools.com/css/DEFAULT.asp