CSS

CSS Tutorial!

If you started to learn CSS then this page is a good starting point to learn CSS. For those advanced in css language, we show complex examples using new features of CSS3 standard.
For beginners the most important examples that we have to practice are: colors and backgrounds, text alignment, set items in a page web page using margin and padding.

About CSS!

CSS stands for Cascading Style Sheets
CSS are used to format web pages
CSS are used to build web pages layouts
CSS are used to build templates for websites
CSS code can be stored inside HTML page or in external css files

CSS tutorial

Text Align
Text Transform
Text Decoration
Text Indent
Line Height
Word Spacing
Font Style
Font Size
Font Family
Background Color
Links
List Style Type
Table Border
Table Collapse Border
Table Width and Height
Border
Margin
Padding
Height and Width
Text

Text

The CSS Text property it is used for formatting the html page content.

The Text properties are:

color
direction
letter-spacing
line-height
text-align
text-decoration
text-indent
text-shadow
text-transform
text-overflow
unicode-bidi
vertical-align
white-space
word-spacing

Text example:

<html>
<head>

</head>
<body>
The heading text.
The paragraph text.
</body>
</html>

The heading text.

The paragraph text.

Height and Width

The CSS Height and Width property it is used to set the height of a html element.

Height and Width

Height and Width example:

<html>
<head>

</head>
<body>
<div class="x1">
The height is 150 pixels.
The  width is 350 pixels.
</div>
</body>
</html>

The height is 150 pixels.

The width is 350 pixels.

Padding

The CSS Padding property it is used to set the space between an html element border and the html element content. The padding values are: auto, length (px, pt, cm, em), %, inherit.

The Padding properties are:

padding
padding-left
padding-right
padding-top
padding-bottom

Padding example:

<html>
<head>

</head>
<body>
My standard paragraph.
Paragraph with padding declared.
Paragraph with a specified padding bottom.
Paragraph with a specified padding to left.
</body>
</html>

My standard paragraph.

Paragraph with padding declared.

Paragraph with a specified padding bottom.

Paragraph with a specified padding to left.

Margin

The CSS Margin property it is used to set the space around an html element.
The margin values are: auto, length (px, pt, cm), %, inherit.

The Margin properties are:

margin
margin-left
margin-right
margin-top
margin-bottom

Margin example:

<html>
<head>

</head>
<body>
My standard paragraph.
Paragraph with margin declared.
Paragraph with a specified margin bottom.
Paragraph with a specified margin to left.
</body>
</html>

My standard paragraph.

Paragraph with margin declared.

Paragraph with a specified margin bottom.

Paragraph with a specified margin to left.