The syntax of a CSS filedivider

The syntax of a CSS file consists of three parts: selector, property and a value:selector {property: value}The selector is usually a HTML element(tag) that you want to define. For example, you can specify in your CSS file:body {text-align: center}This line will state that the entire text in the <body> tag will be centered. Since CSS lines cascade, however, you can specify:p {text-align: left}in order to make the text surrounded by paragraph (<p>) tags aligned to the left.If you want to specify the same parameters for multiple tags, you can simply group them:

p,h1,h2,h3 {color: red}

If you set this line, all the text in those tags will be in red.This, however, is a very basic example of the freedom and power that CSS gives you. Usually much more than one parameter is set to each tag. To make your definitions easier to read and follow, you can write each property on a separate line:

p{text-align: center;color: red;font-family: arial;}

Those lines will define the alignment, color and the font of the text in each one of your paragraphs.In the creation process of your website, you may want to have multiple styles for each tag. For example, you may want to have a paragraph that is aligned to the left and colored in red and another one that is aligned to the right and colored in blue. To achieve this result, you need to use classes. For example, you can define two classes named “my_left” and “my_right”:

.my_left{text-align: left;color: red;}.my_right{text-align: right;color: blue;}

Once you have done that, in your HTML code you can specify the class property of the items that you want to be formated this way. For the purpouses of this tutorial we will display two paragraphs:

<p > This paragraph will be left-aligned with red color in it. </p>
<p > This paragraph will be right-aligned with blue text in it. </p>

In some cases, however, this level of customization will not be enough. Let’s say you would like to have one of your left-aligned paragraphs to use the Arial font. In this case, you can specify an “id selector” in your CSS file:#arial {font-family: arial}You should then define the HTML tag in your code as follows:

<p id="arial"> This text will be left-aligned with red text displayed with Arial font </p>

Those are only the very basics of CSS that you need to know in order to be able to make simple modifications to your website. CSS gives you great freedom to create the design you want. Actually, each design effect can be achieved in many different ways. It depends on you to organize and develop your website in a way that will best serve your needs.