Nov 22, 2012

CSS Tutorial Series #1

So this will be the first tutorial series on our site. This is a CSS series in this series we will try to cover all the topics about CSS such as the pseudo-class and etc..

Lets start 

First of all whats CSS?

CSS means Cascadind Sthyle Sheets
Its easy to learn??

Of course yes is one of the easiest languages which most web developers use.

Why to use CSS?

You should use it in order to define the formatting applied on your website such as colors, backround images and etc..


Defining Styles With CSS
The basic purpose of CSS is to allow designers to define a style ( a list of formatting details) and then to apply it to html page(s).




<html>
<head>
<title>Sample Page</title>
<body>
<h1><font face='sans-serif' color='#336600'>Title 1</font>

</h1>
<p>...</p>

<h2><font face="sans-serif" color="#3366CC>Title 2</font>
</h2>
<p></p>


<h2><font face="sans-serif" color="#3366CC>Title 3</font>
</h2>

<p></p>

</body>
</head> 


This was a simple example so we used three separate times. But i wouldn't be better to define the fonts at once, then apply to headinds?

With the power of CSS we can do this



<html>
<head>
<title>Sample Page</title>
<style type="text/css">
h1, h2 {
  font-family: sans-serif;
  color: #3366cc;
}
</style>
<body>
<h1><Title 1</h1>
<p>...</p>

<h2>Title 2</h2>

<p>...</p>

<h2>Title 3</h2>


<p>...</p>


</body>

</head> 

Now this is just a small example what we will learn from this series i know that  you think that this tutorial is a little bit uncompleted but next time i will try to cover the tutorial as much as i can.

Thanks a lot !

2 comments: