>> English << | Português | По-русскиZVON > Tutorials > CSS tutorial
>> Example 1 << | Prev | Next | Contents

Description

In this tutorial you will learn how to define look of your pages from one central CSS file. Case-1 and Case-2 are based on the same HTML source, but they are using different stylesheet for their final formatting. The stylesheet is specified by the link element. Attribute href gives the location of the stylesheet file, type attribute must have the value "text/css" and rel attribute the value of "stylesheet".

Case 1 | >> Case 2 <<
HTML SourceCSS stylesheet
<html>
<head>
<link rel='stylesheet' type='text/css' href='css2.css'>
<title>A CSS example</title>
</head>
<body>

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<p>Text</p>
</body>
</html>
h1 {font-style:italic}
h2 {text-decoration:underline;}
h3 {text-transform:lowercase}
h4 {text-decoration:line-through}
h5 {text-transform:uppercase}
p  {color:green}

Browser output