Gå til innhold

Hvordan lage en side som dette?....


Anbefalte innlegg

Noen som vet hvordan man setter opp en side sånn som dette?

*Midstilt

*Header

*footer

*tekst

*navigasjon/meny

 

Noen som har tips hvordan man kan lage en sånn side fort? og ikke så komplisert?

zzzdx.jpg

 

Takk på forhånd :D

Lenke til kommentar
Videoannonse
Annonse

Det der er TwentyEleven-temaet til Wordpress: http://theme.wordpress.com/themes/twentyeleven/

 

Alt du trenger å gjøre er å installere wordpress, så følger det med.

 

Hvis du derimot ikke ønsker å bruke Wordpress, og ikke er helt stødig på HTML/CSS, finnes det ulike generatorer tilgjengelig på nett. Et eksempel: http://www.pagecolumn.com/

 

Du kan velge mellom ulike oppsett, og endre bredde bare ved å dra i noen slidere. Ganske enkelt! :)

Lenke til kommentar

One.com har en fin blogg-funksjon på webhotellene deres med ferdige maler og design. Et webhotell og domene koster nesten ingenting hos dem. Fungerer veldig greit, enkelt å sette opp og enkelt å bruke.

Endret av espenandre
Lenke til kommentar

Her er en ramme du kan bygge videre på. Fungerer i alle nyere nettlesere ned til og med IE6.

 

<!DOCTYPE html>
<html lang="no">
<head>
   <meta charset="utf-8" />
   <title>Tittel</title>
   <style>
   html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    background: #ddd;
   }
   #side {
    margin: 50px auto;
    width: 920px;
    background: #fff;
   }
   #header {
    width: 100%;
    height: 200px;
    color: #eee;
    background: #58b;
   }
   #nav {
    width: 100%;
    height: 40px;
    background: #222;
   }
   #nav ul,
   #nav li {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
   }
   #nav li {
    float: left;
    display: block;
    margin-right: -3px;
    padding: 0 10px;
    line-height: 40px;
   }
   #nav a {
    color: #eee;
   }
   #innhold {
    width: 100%;
   }
   .artikkel {
    margin: 50px;
    padding: 50px;
    background: #eee;
   }
   #footer {
    padding: 15px 50px;
    width: 820px;
    height: 70px;
    background: #58b;
   }
   </style>
</head>
<body>
<div id="side">
   <div id="header">
    <h1>Heipådeg.no</h1>
    <p class="slagord">Verdens beste hjemmeside!</p>
   </div>
   <div id="nav">
    <ul>
	    <li><a href="#">Lenke 1</a></li>
	    <li><a href="#">Lenke 2</a></li>
	    <li><a href="#">Lenke 3</a></li>
	    <li><a href="#">Lenke 4</a></li>
    </ul>
   </div>
   <div id="innhold">
    <div class="artikkel">
	    <h2>Artikkel 1</h2>
	    <p>Her kommer tekst og innhold</p>
    </div>
    <div class="artikkel">
	    <h2>Artikkel 2</h2>
	    <p>Her kommer enda mer tekst og innhold</p>
    </div>
    <div class="artikkel">
	    <h2>Artikkel 3</h2>
	    <p>Her er siste artikkel med tekst og innhold</p>
    </div>
   </div>
   <div id="footer">
    <p>Siden er laget av...</p>
   </div>
</div>
</body>
</html>

Endret av agm
  • Liker 1
Lenke til kommentar

Her er en ramme du kan bygge videre på. Fungerer i alle nyere nettlesere ned til og med IE6.

 

<!DOCTYPE html>
<html lang="no">
<head>
<meta charset="utf-8" />
<title>Tittel</title>
<style>
html, body {
	margin: 0;
	padding: 0;
	width: 100%;
	background: #ddd;
}
#side {
	margin: 50px auto;
	width: 920px;
	background: #fff;
}
#header {
	width: 100%;
	height: 200px;
	color: #eee;
	background: #58b;
}
#nav {
	width: 100%;
	height: 40px;
	background: #222;
}
#nav ul,
#nav li {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
}
#nav li {
	float: left;
	display: block;
	margin-right: -3px;
	padding: 0 10px;
	line-height: 40px;
}
#nav a {
	color: #eee;
}
#innhold {
	width: 100%;
}
.artikkel {
	margin: 50px;
	padding: 50px;
	background: #eee;
}
#footer {
	padding: 15px 50px;
	width: 820px;
	height: 70px;
	background: #58b;
}
</style>
</head>
<body>
<div id="side">
<div id="header">
	<h1>Heipådeg.no</h1>
	<p class="slagord">Verdens beste hjemmeside!</p>
</div>
<div id="nav">
	<ul>
		<li><a href="#">Lenke 1</a></li>
		<li><a href="#">Lenke 2</a></li>
		<li><a href="#">Lenke 3</a></li>
		<li><a href="#">Lenke 4</a></li>
	</ul>
</div>
<div id="innhold">
	<div class="artikkel">
		<h2>Artikkel 1</h2>
		<p>Her kommer tekst og innhold</p>
	</div>
	<div class="artikkel">
		<h2>Artikkel 2</h2>
		<p>Her kommer enda mer tekst og innhold</p>
	</div>
	<div class="artikkel">
		<h2>Artikkel 3</h2>
		<p>Her er siste artikkel med tekst og innhold</p>
	</div>
</div>
<div id="footer">
	<p>Siden er laget av...</p>
</div>
</div>
</body>
</html>

hjalp dette, takk:D
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
×
×
  • Opprett ny...