Hulp nodig bij maken van layout

  • Onderwerp starter Onderwerp starter ravo
  • Startdatum Startdatum
Status
Niet open voor verdere reacties.
R

ravo

Gebruiker
Lid geworden
16 apr 2008
Berichten
77
hallo kan iemand mij helpen met een layout maken.
in de bijlage ziet u hoe die ongeveer eruit moet zien.

alvast bedankt,

Ravo
Mod: Volgende keer graag een titel bedenken welke je probleem omschrijft.
 

Bijlagen

  • Website.JPG
    Website.JPG
    10,5 KB · Weergaven: 62
Laatst bewerkt door een moderator:
Hey ravo

Zulke dingen zijn vaak enorm leuk om zelf te maken en te proberen. Maar ik zal je wel een opzet geven en de rest zal je dan wel zelf moeten doen.
HTML of PHP bestand
Code: 
<html>

<head></head>

<body>
<div id="container">
	<div id="header">
		<div id="logo"></div>
		<div id="slogan"></div>
	</div>
	<div id="content">
		<div id="menu"></div>
		<div id="main"></div>
	</div>
	<div id="footer">
	</div>
</div>
</body>

</html>
CSS bestand
Code: 
#container {width:100%;
			height:100%;}

	#header {	width:100%;
				height:30%;}
		
		#logo {	width:20%;
				height:100%;}
		
		#slogan {	width:80%;
					height:100%;}
	
	#content {	width:100%;
				height:60%;}
	
		#menu {	width:30%;
				height:100%;}
		
		#main {	width:70%;
				height:100%;}
	
	#footer {	width:100%;
				height:10%;}
succes ermee en probeer maar wat uit leer je ook veel van
 
moet hij altijd het hele scherm vullen?(wel zo mooi)
kan je een beetje html
nie voor de css moet je al die vakje plaatsen
dus begin je met het logo(om zo'n vakje(div) te plaatsen typ je of een # of een . eentje met een # gebruikje voor element dat maar 1keer op de pagina voor komt en . voor iets dat vaker voor komt) de eigen schappen van dat element zet je er achter tussen {}
Code: 
#logo  {
width:300px;
heigth:200px;
}
zoals je ziet sluit je een eigenschap regel af met een ;
alle elemente staat als je ze geen coordinaten mee geeft in de linker boven hoek
bij jouw site gaan we dus gewoon alles naar zijn plaats duwen met margin
Code: 
#logo  {
width:300px;
heigth:200px;
}
#header {
width:400px;
heigth:200px;
margin-top:-200px;
margin-left:300px;
}
#menu {
width:300px;
heigth:600px;
}
(ik heb de code zo simpel mogelijk gehouden:thumb:) als je deze code bestudeerd probeer de main er dan is in te zetten
 
goeie gitaar bij je video :)
gedetailleerdere vragen kunnen BTW ook gewoon hier of elders op het forum geplaatst worden hoor.
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan