|
How to Create a Basic Template |
|
|
|
|
Written by Cory
|
|
Monday, 25 September 2006 |
|
Page 4 of 7
Step 3: CSS
This is where we start to see the design elements really take shape. At the end of this step, we will have our basic framework in place. Here is the CSS code:
* {
margin: 0;
padding: 0;
}
body {
background-color: #fff;
color: #666;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
a, a:link, a:visited {
color: #900;
text-decoration: none;
}
a:hover {
text-decoration: underline;
color: #000;
}
h1#sitetitle {
padding: 100px 0 0;
background: #fff url(../images/logo.png) center top no-repeat;
font-size: 20px;
font-weight: bold;
text-align: center;
color: #000;
}
h1#sitetitle a, h1#sitetitle a:link, h1#sitetitle a:visited {
text-decoration: none;
color: #000;
}
h1#sitetitle a:hover {
text-decoration: none;
color: #000;
}
h2#siteslogan {
font-size: 14px;
font-weight: bold;
margin: 0 0 10px;
text-align: center;
color: #000;
}
#sidebar {
width: 215px;
margin: 10px 0 10px 10px;
float: left;
color: #000;
}
#mainbar {
margin: 10px 10px 10px 235px;
}
/*
Joomla Elements Will be added in Step 4: Joomlafy
*/
|
