CSS TUTORIAL
What is CSS?
* CSS stands for Cascading Style Sheets
* Styles define how to display HTML elements
* Styles are normally stored in Style Sheets
* Styles were added to HTML 4.0 to solve a problem
* External Style Sheets can save you a lot of work
* External Style Sheets are stored in CSS files
* Multiple style definitions will cascade into one
|
You should store your css in an external file.
External Style Sheet
With an external style sheet, you can change the look of an entire Web site
by changing one file. Each page must link to the style sheet using the
<link> tag. Put the <link> tag inside the head section:
<html>
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
<body>
</body>
....your website html document...
</html>
|
CSS Syntax:
The CSS syntax is made up of three parts: a selector, a property and a value:
selector {property: value}
body {color: black}
p {text-align:center;color:red}
p
{
text-align: center;
color: black;
font-family: arial
}
|
Grouping
You can group selectors like this:
h1,h2,h3,h4,h5,h6
{
color: green
}
|
The class Selector
With the class selector you can define different styles for the same type of HTML element.
If you would like to have two types of paragraphs in your html-document.
One center-aligned paragraph and another right-aligned.
p.center {text-align: center}
p.right {text-align: right}
|