Learn CSS

If you are bother about changing the style for individual pages many times then don’t worry CSS will simplify your work. It will control the style and layout of multiple web pages at once
But, before entering to the CSS you must know the basic understanding of the language like HTML. If you want to study HTML you can join on HTML page available at http://www.udayachaulagain.com.np

Basic of CSS.

CSS stands for Cascading Style Sheets.Main job of CSS is to define the HTML elements how they are to be displayed.It will save lot of time as external Style Sheets are stored in CSS files.
Actually HTML was for the defining the content of the document such as <h1></h1> defines the heading <p></p>defines the paragraph. And we must be conscious that, HTML was not intended to contain tags for formatting a document.

CSS Syntax

We can describe the CSS rule set with selector and Declaration.Where selector indicates the elements of the HTML that has to be styled and declaration block contains one or more declaration s separated by semicolons. Where each declaration has property name and their value, separated by a colon.

Note: that, each declaration always ends with a semicolon and declaration groups are surrounded by curly braces.

CSS Selectors

CSS electors is used to manipulate HTML elements and these Selectors are used to find or select HTML elements according to their id, class, type or attribute. We can categories CSS Selectors as below.
• The element Selector
• Id Selector
• Class Celector
Element Selector: This is used to selects elements based on the element name. for example we can select element like p { text-align: center; color:red;}

The id Selector

This is used with id attribute of an HTML element to select a specific element. There must be unique id within a page because id selector is used to select a single and unique elements.

Example
#id{
Text-align: left;
Color: green;
}
Not: id name never start with a number.

The class Selector

This is used with class attribute and it is used to select elements with specific class. The class selector always starts with period character.
.class {
margin-left: 10px;
color: green;
}

We can specify for a specific elements that should be affected by a class.Below example will center-aligned for all <h2> elements with .center attributes.
Example

p.center {
text-align: center;
margin: 3px;
color: green;
}

Grouping Selectors

We can group different selectors, by separating each with a comma. This is used if we group different selector with same style.
Example

h1, h2, p {
text-align: center;
color: green;
}

When a browser reads a style sheet, it will format the document according to the information in the style sheet.