HTML-Lesson 5
Adding a touch of style
Now do this
Click on this link to see the sort of web page you can now write. Not very exciting, isn't it?
Add a line to your web page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title</title>
<link rel="stylesheet" type="text/css" href="page.css" />
</head>
<body>
<h1>A large heading</h1>
<p>
A paragraph of content
</p>
</body>
</html>
and save the file.
Now type the following:
body {
background-color: #ffffaa;
color: #000099;
margin-left: 5%;
font-family: Arial, verdana, Helvetica, sans-serif;
font-size: small;
}
.cen {
height: auto;
margin-left: auto;
margin-right: auto;
text-align: center;
}
and save this file as 'page.css' in the same folder as your HTML file.
Now click on this link to see the sort of difference a CSS file can make. Much better. Isn't it? To explore style out of order, click on this link.
