Jeg ser at du vil have den lavet i PHP, det var jeg nu ikke indstillet på, fornemmede at du heller ikke endnu havde den store indsigt i HTML - derfor har jeg lavet dette mastereksempel.
Har du lidt kendskab til HTML, kan du sagtens selv splitte det op så layoutet kan anvendes på alle dine sider.
..............................
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<title>homepage i ren html og css</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css" media="screen">
body{
font: normal 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
background-color: #B3AEB5;
/* background-image: url(../img/IMG342-75.jpg); Note:her kan indsættes bg.img*/
background-attachment:fixed;
background-repeat:no-repeat;
background-position: center;
}
a:link {
font: bold 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
color: #6D8269;
text-decoration: none;
}
a:active {
font: bold 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
color: #6D8269;
text-decoration: none;
}
a:visited {
font: bold 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
color: #6D8269;
text-decoration: none;
}
a:hover {
font: bold 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
color: #AF0020;
text-decoration: none;
}
#navi ul {
list-style: none;
}
#navi li {
display: inline;
padding-right: 0px;
}
#navi a {
padding: 5px 8px;
background: #6D8269;
color: #fff;
font-size: 14px;
font-weight: bold;
text-decoration: none;
}
#navi a:hover {
background: #AF0020;
color: #fff;
}
H1 {
font-size:large;
font-style: normal;
font-weight:bold;
color: Maroon;
margin-top: 4px;
margin-bottom: 4px;
}
H2 {
font-size: medium;
font-style: normal;
font-weight: bold;
color: Maroon;
margin-top: 10px;
margin-bottom: 4px;
}
H3 {
font-size: small;
font-style: normal;
font-weight: bolder;
color: Maroon;
margin-top: 10px;
margin-bottom: 4px;
}
H4 {
font-size: x-small;
font-style: normal;
font-weight: normal;
color: Black;
margin-top: 10px;
margin-bottom: 4px;
}
H5 {
font-size: x-small;
font-style: normal;
font-weight: normal;
color: Maroon;
margin-top: 10px;
margin-bottom: 4px;
}
H6 {
font-size: smaller;
font-style: normal;
font-weight: lighter;
color: Maroon;
margin-top: 10px;
margin-bottom: 4px;
}
.border
{
border: solid 1px #6D8269;
}
.left
{
float: left;
}
.right
{
float: right;
}
.scroll
{
overflow: auto;
}
.wrapper
{
width: 770px;
margin:0 auto;
}
.title
{
background-color: #6D8269;
color: #C7E1A7;
font-weight: bolder;
font-size: x-large;
padding: 10px 20px 10px 20px;
}
.title2
{
background-color: #6D8269;
color: #C7E1A7;
font-weight: lighter;
font-size: small;
}
.title3
{
color: Green;
font-weight: bold;
font-size: 18px;
}
.titlemargin
{
margin: 10px 0px 10px 0px;
}
.subtitle
{
color: #ffffff;
font-weight: bold;
font-size: 14px;
}
.content
{
padding: 0px 20px 0px 20px;
font-size: 12px;
color: Black;
padding: 0px;
margin: 0px;
}
.content.padleft
{
padding-left: 180px;
}
.content.padright
{
padding-right: 180px;
}
.sidebar
{
width: 150px;
height: auto;
background-color: #C7CFA7;
color: #C7CFA7;
font-weight: bold;
padding: 10px 0px 5px 0px;
}
.sidebaritem
{
width: 130px;
background-color: #C7E1A7;
color: #6D8269;
border: solid 1px #6D8269;
font-size: 14px;
padding: 2px;
margin-bottom: 3px;
}
.sidebaritem.first
{
margin-top: 10px;
}
.footer
{
background-color: #C7CFA7;
font-size: 10px;
text-align: center;
color: White;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="title titlemargin" style="height: 20px;">
<div style="float: left; margin-left: 120px;">Her er mit Website.dk</div>
</div>
<div class="title2 titlemargin" style="height: 20px;">
<div style="float: left; margin-left: 160px;"> </div>
</div>
<ul id="navi" class="menu">
<li><a href="#">Startside</a></li>
<li><a href="#">Forår</a></li>
<li><a href="#">Sommer</a></li>
<li><a href="#">Vinter</a></li>
<li><a href="#">Adresser</a></li>
<li><a href="#">Foto</a></li>
<li><a href="#">Kontakt</a></li>
<li><a href="#">Nyheder</a></li>
<li><a href="#">Arkiv</a></li>
</ul>
<div class="sidebar left" align="center">
<div class="subtitle">Menu</div>
<div class="sidebaritem first"><a href="#" target="_self" title="Startside">Startside</a></div>
<div class="sidebaritem"><a href="#" title="aktiviteter" target="_self">Aktiviteter</a></div>
<div class="sidebaritem"><a href="#" title="vedtægter" target="_self">Vedtægter</a></div>
<div class="sidebaritem"><a href="#" title="dokumenter" target="_self">Dokumenter</a></div>
<div class="sidebaritem"><a href="#" title="link" target="_self">Link</a></div>
<div class="sidebaritem"><a target="#"></a></div>
<div class="sidebaritem"><a href="#" title="Lidt om mig" target="_self">Lidt om mig</a></div>
</div>
<div class="sidebar right" align="center" style="clear: both;">
<div class="subtitle">Links</div>
<div class="sidebaritem first"><a href="
http://www.eksperten.dk/spm/779167" title="Spørg eksperterne" target="_blank">Eksperten.dk spm. 779167</a></div>
<div class="sidebaritem"></div>
<div style="width:130px;border:3px solid maroon">
<div style="background-color:maroon;color:white;text-align:center;padding:2px 0px;">Brug website rigtigt</div>
<div style="padding: 10px;"><h4>Her kan der indsætte infobokse/reklamer eller aktuelle ting <br>F. eks. hvis der er specielle ting der skal oplyses i forbindelse med den aktuelle side.<br>Boxen afpasser sig efter det indhold der bliver indsat her</h4></div>
</div>
<div style="padding: 10px;"><h4>Der kan selvfølgelig også indsættes info uden box-rammen<br>Spalten højde kan kun afpasses af det indhold der er i den</h4></div>
</div>
<div class="content padleft padright">
<p>
<H2>Mit Website.dk</H2><p>
<H3> Sidst tilføjet</H3>
<p>Når man laver et nyt layout er næsten umuligt at teste alt, der er mange forskellige browsere, skærmopløsninger o.s.v.,så der vil ganske givet være ting, der måske undre dig, derfor skriv en kommentar her til indlæget
<p>Mars - den røde planet
Navnet har den fået, fordi den på himlen skinner med et svagt orangerødt skær. Årsagen hertil skal søges i den kemiske sammensætning af marsgruset. Det indeholder store mængder af oxideret jern, eller med andre ord rust. Marsoverfladen bærer præg af, at der en gang har flydt en eller anden væske - formentlig vand - på dens overflade.
I dag er Mars en tør, kold planet uden en brugbar atmosfære til at holde på vand som væske. Is er der meget af - både ved Mars' poler og som permafrost i mars-skorpen. Store vulkaner vidner om, at Mars i en ikke så fjern fortid har været geologisk aktiv, men nu synes alt roligt. Den geologiske aktivitet har oså frembragt vældige kløfter, hvoraf Valles Marineris med mere end 6 km's dybde langt overgår de jordiske, f.eks Grand Canyon, som "kun" er 1829 m.
Mars har givet navn til tirsdag (Latin: Dies Martis, fransk: Mardi)
<h6>ibtage </H6>
<br><br>
</div><BR>
<div class="footer" style="clear: both;"> Copyright © 2005 ib bermann </div>
</div>
</body>
</html>
Slettet bruger
Ny bruger
Nybegynder
Opret
Preview
