The objective of this tutorial is to get some styled text into our webpage.
Part One: HTML
First we must have some text to work with so open up our index.html.
Within the content div insert:
Code: Select all
<p>This is some text that will be styled. </p>
If you are unsure what the outcome will look like i will so you now:
Code: Select all
<html>
<head>
<title>Basic CSS Tutorial</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="wrapper">
<div class="banner">
</div>
<div class="sidebar">
</div>
<div class="content">
<p>This is some text that will be styled. </p>
</div>
</body>
</html>
Part Two: Styling the text.
We must now give this text a style. So go ahead and open up your style.css. Insert this:
Code: Select all
.content p{
margin-top:20px
margin-left:20px;
margin-right:20px;
font:Verdana, Arial, Helvetica, sans-serif;
}
Load up your index.html and the text should now have margins.
The end of part two of my basic css tutorial.
