Hallo allemaal,
Als opdracht moest ik laatst een website maken met html.
Ik heb frames gebruikt,
Om het mooi aan te kleden heb ik achtergronden gemaakt voor de site maar dit werkte niet helemaal vlekkeloos...
niet alles kwam recht onder elkaar te staan en ik wist de preciese afmetingen ook niet (dus heb ik maar een screeshot gemaakt en in photoshop eruit gehaald).
En als je de site uitzoomde zag je de plaatjes naast en onder elkaar verdubbelen....
Iemand DE oplossing?
Ik wil graag wat verder komen dan mijn eerste html-site....
Greetz
Bob
Photoshop-Tutorials.nl - Photoshop Forum
Van Photoshoppers Voor Photoshoppers
combinatie html met achtergronden
Moderators: Gloomy, Walter, Mittch
17 berichten • Pagina 1 van de 2 • 1, 2
Re: combinatie html met achtergronden
door Gloomy op wo dec 22, 2010 01:40
ten eerste: frames is a no go.
het slechtste wat je ooit kan gebruiken om een website in delen te splitsen is frames. Frames werden namelijk gebruikt tot en met 1998. daarna kwamen table layouts. die nogsteeds vaak te zien zijn ( bijvoorbeeld dit forum type: phpbb 1 2 en 3)
hoe dit werkt:
je maakt een tabel met 2 kolommen:
daarnaast. achtergronden coderen met html. naja. het kan. maar daar houd het dan ook bij op.
Als ik jou was zou ik meteen een tutorial CSS volgen. Dit werkt namelijk erg makkelijk
en als je HTML ook maar een beetje snapt ( dat je elke tag moet openen en afsluiten etc.)
dan kan je makkelijk CSS leren. ik zelf leerde CSS in 2 daagjes 2 keer 4 uur. en bij ons op de HBO wordt er zelfs maar 2 keer een les van 1.5 uur aan besteed
houd in gedachten: HTML is een coderings taal voor enkel structuur. CSS ( cascading style sheet) gebruikt je om die structuur vorm te geven, naast elkaar te plaatsen, achtergronden, borders etc.
het slechtste wat je ooit kan gebruiken om een website in delen te splitsen is frames. Frames werden namelijk gebruikt tot en met 1998. daarna kwamen table layouts. die nogsteeds vaak te zien zijn ( bijvoorbeeld dit forum type: phpbb 1 2 en 3)
hoe dit werkt:
je maakt een tabel met 2 kolommen:
- Code: Selecteer alles
<table>
<tr>
<td>hier de inhoud van de linker kolom</td>
<td>hier de inhoud van de content </td>
</tr>
</table>
daarnaast. achtergronden coderen met html. naja. het kan. maar daar houd het dan ook bij op.
Als ik jou was zou ik meteen een tutorial CSS volgen. Dit werkt namelijk erg makkelijk
en als je HTML ook maar een beetje snapt ( dat je elke tag moet openen en afsluiten etc.)
dan kan je makkelijk CSS leren. ik zelf leerde CSS in 2 daagjes 2 keer 4 uur. en bij ons op de HBO wordt er zelfs maar 2 keer een les van 1.5 uur aan besteed
houd in gedachten: HTML is een coderings taal voor enkel structuur. CSS ( cascading style sheet) gebruikt je om die structuur vorm te geven, naast elkaar te plaatsen, achtergronden, borders etc.
- Gloomy
- Berichten: 2233
- Geregistreerd op: ma feb 25, 2008 10:32
Re: combinatie html met achtergronden
door webmasterbob op wo dec 22, 2010 13:13
Hi Gloomy
tnx voor je snelle antwoord ik zal me verdiepen in css...
(heb alleen maar geleerd dat je met h1 en h2 enzo de lettertypes kan veranderen...)
Maar met een tabel moet je dan toch met elke pagina bijv de titel-banner opnieuwe invoegen enzo?
Heb je nog een goeie site?
tnx voor je snelle antwoord ik zal me verdiepen in css...
(heb alleen maar geleerd dat je met h1 en h2 enzo de lettertypes kan veranderen...)
Maar met een tabel moet je dan toch met elke pagina bijv de titel-banner opnieuwe invoegen enzo?
Heb je nog een goeie site?
- webmasterbob
- Berichten: 71
- Geregistreerd op: di dec 21, 2010 21:20
Re: combinatie html met achtergronden
door Gloomy op wo dec 22, 2010 14:00
ja dat moet inderdaad.
de meeste mensen gebruiken hiervoor PHP.
een serverside taal.
wat je dan kan doen is de volgende code:
dat zorgt ervoor dat alle code van header.html daar neergeplant wordt. op die manier kan je er dus voor zorgen dat je niet constant een nieuwe header hoeft te coderen.
maar dat gaat wel een stukje verder
en ik zou daar maar even mee wachten
de meeste mensen gebruiken hiervoor PHP.
een serverside taal.
wat je dan kan doen is de volgende code:
- Code: Selecteer alles
<?php include"header.html"; ?>
dat zorgt ervoor dat alle code van header.html daar neergeplant wordt. op die manier kan je er dus voor zorgen dat je niet constant een nieuwe header hoeft te coderen.
maar dat gaat wel een stukje verder
en ik zou daar maar even mee wachten - Gloomy
- Berichten: 2233
- Geregistreerd op: ma feb 25, 2008 10:32
Re: combinatie html met achtergronden
door webmasterbob op zo jan 02, 2011 14:52
hi,
ik ben 1 stapje verder: div
alleen ik kan een laag niet centreren....
en maakt het uit welke browser ik gebruik?
Greetz
ik ben 1 stapje verder: div
alleen ik kan een laag niet centreren....
en maakt het uit welke browser ik gebruik?
Greetz
- webmasterbob
- Berichten: 71
- Geregistreerd op: di dec 21, 2010 21:20
Re: combinatie html met achtergronden
door Gloomy op zo jan 02, 2011 21:06
jaa elke browser doet alles anders, vooral IE daarom haat iedere webdesigner IE.
hoe je iets centreerd.
geef een div een breedte ( bijv. width:960px;
en vervolgens kan je hem dan centreren met:
margin-left: auto;
margin-right: auto;
hoe je iets centreerd.
geef een div een breedte ( bijv. width:960px;
en vervolgens kan je hem dan centreren met:
margin-left: auto;
margin-right: auto;
- Gloomy
- Berichten: 2233
- Geregistreerd op: ma feb 25, 2008 10:32
Re: combinatie html met achtergronden
door webmasterbob op zo jan 02, 2011 21:52
Haha en dat wekte juist niet bij mij..... (of ik doe iets verkeerd...)
Maar hoe maak je hem dan als webmaster zo dat iemand die op de website komt via IE, dat ie gewoon werkt?
Ik zal die margin morgen nog een keer proberen
Kun je anders een vb sturen?
Maar hoe maak je hem dan als webmaster zo dat iemand die op de website komt via IE, dat ie gewoon werkt?
Ik zal die margin morgen nog een keer proberen
Kun je anders een vb sturen?
- webmasterbob
- Berichten: 71
- Geregistreerd op: di dec 21, 2010 21:20
Re: combinatie html met achtergronden
door Gloomy op zo jan 02, 2011 23:51
plaats hier maar even je code tot nu toe. dan kijk ik er wel eventjes naar
- Gloomy
- Berichten: 2233
- Geregistreerd op: ma feb 25, 2008 10:32
Re: combinatie html met achtergronden
door webmasterbob op ma jan 03, 2011 09:52
hier mijn codes
*html code*
*mijn css*
hij werkt nog steeds niet....
*html code*
- Code: Selecteer alles
<html>
<head>
<LINK href="opmaak.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="header">
welkom
</div>
</body>
</html>
*mijn css*
- Code: Selecteer alles
#header {
width: 980 px;
height: 100 px;
margin-left: auto;
margin-right: auto;
background-color: #E0DD06;
}
hij werkt nog steeds niet....
- webmasterbob
- Berichten: 71
- Geregistreerd op: di dec 21, 2010 21:20
Re: combinatie html met achtergronden
door Gloomy op ma jan 03, 2011 10:26
ahkey naja je bent nu in iedergeval tegen het eerste probleem van IE gelopen. dat van het niet uitlijnen naar het midden is echt een fout die volgens de W3C bijvoorbeeld wel moet werken ( door middel van gebruik van margins).
om het toch voor mekaar te krijgen heeft microsoft iets leuks en idioots bedacht.
namelijk: je moet het volgende doen:
body {
text-align: center;
}
#header {
width: 980 px;
height: 100 px;
margin-left: auto;
margin-right: auto;
background-color: #E0DD06;
text-align: left;
}
met de eerste text-align in de body zeg je dat alles dat in de body staat gecentreerd moet worden.
en vervolgens zeg je in de header dat alles wat in de header komt weer gewoon links uitgelijnd moet worden.
om het toch voor mekaar te krijgen heeft microsoft iets leuks en idioots bedacht.
namelijk: je moet het volgende doen:
body {
text-align: center;
}
#header {
width: 980 px;
height: 100 px;
margin-left: auto;
margin-right: auto;
background-color: #E0DD06;
text-align: left;
}
met de eerste text-align in de body zeg je dat alles dat in de body staat gecentreerd moet worden.
en vervolgens zeg je in de header dat alles wat in de header komt weer gewoon links uitgelijnd moet worden.
- Gloomy
- Berichten: 2233
- Geregistreerd op: ma feb 25, 2008 10:32
Re: combinatie html met achtergronden
door webmasterbob op ma jan 03, 2011 21:11
Aha..... Maar met w3c zou dat opgelost kunnen worden?
Ik ga die text-align even proberen. Je hoort nog van me
Ik ga die text-align even proberen. Je hoort nog van me
- webmasterbob
- Berichten: 71
- Geregistreerd op: di dec 21, 2010 21:20
Re: combinatie html met achtergronden
door Gloomy op ma jan 03, 2011 23:05
W3C is het bureau dat de webstandaard bedenkt en probeert te lobbyen bij browser makers om ervoor te zorgen dat er 1 uniforme interpretatie van HTML en CSS komt.
Helaas wordt die standaard door maar een paar browsers succesvol gevolgt.
zo zitten chrome en safari er het dichtste bij, en Internet explorer er het verste vanaf.
IE heeft ook wel grotere fouten gemaakt... Zo hebben firefox, chrome en safari allemaal een automatische update functie. zodra er een update is wordt deze vrijwel automatisch gedownload en geinstalleerd zodra je firefox afsluit of de volgende keer opstart. Daarom kom je vrijwel nooit bezoekers met oude versies van die browsers op je website tegen.
Internet explorer daarentegen brengt zon elk half jaar een nieuwe versie van zijn browser uit tegenwoordig, die je manueel moet downloaden en installeren. en daar nog eens bovenop dat het bericht dat er een nieuwe browser is niet eens voorkomt als je IE6 gebruikt. Op het moment gebruikt zon 5% van alle internet gebruikers dus een browser versie ( IE6) die al zon 3 jaar niet meer geupdate is en waar dus alles apart voor moet worden gecodeerd.
veel mensen boycotten daarom IE ( ook al is het nogsteeds de meest gebruikte browser op het internet). door gewoon geen layout voor ze te maken en een bericht weer te geven "voor optimale ervaring van deze website, download firefox, chrome, safari of opera"
dus tja... er valt eigenlijk niet veel te doen tegen IE en zijn eigenwijsheid behalve maar gewoon dingen voor hun apart coderen, alle dingen die zij fout weergeven speciaal voor hun gebruikers op een andere manier te coderen. etc.
maar hopen dat ze eindelijk wijsheid krijgen binnen hun update systemen en dergelijke haha
Helaas wordt die standaard door maar een paar browsers succesvol gevolgt.
zo zitten chrome en safari er het dichtste bij, en Internet explorer er het verste vanaf.
IE heeft ook wel grotere fouten gemaakt... Zo hebben firefox, chrome en safari allemaal een automatische update functie. zodra er een update is wordt deze vrijwel automatisch gedownload en geinstalleerd zodra je firefox afsluit of de volgende keer opstart. Daarom kom je vrijwel nooit bezoekers met oude versies van die browsers op je website tegen.
Internet explorer daarentegen brengt zon elk half jaar een nieuwe versie van zijn browser uit tegenwoordig, die je manueel moet downloaden en installeren. en daar nog eens bovenop dat het bericht dat er een nieuwe browser is niet eens voorkomt als je IE6 gebruikt. Op het moment gebruikt zon 5% van alle internet gebruikers dus een browser versie ( IE6) die al zon 3 jaar niet meer geupdate is en waar dus alles apart voor moet worden gecodeerd.
veel mensen boycotten daarom IE ( ook al is het nogsteeds de meest gebruikte browser op het internet). door gewoon geen layout voor ze te maken en een bericht weer te geven "voor optimale ervaring van deze website, download firefox, chrome, safari of opera"
dus tja... er valt eigenlijk niet veel te doen tegen IE en zijn eigenwijsheid behalve maar gewoon dingen voor hun apart coderen, alle dingen die zij fout weergeven speciaal voor hun gebruikers op een andere manier te coderen. etc.
maar hopen dat ze eindelijk wijsheid krijgen binnen hun update systemen en dergelijke haha
- Gloomy
- Berichten: 2233
- Geregistreerd op: ma feb 25, 2008 10:32
Re: combinatie html met achtergronden
door webmasterbob op di jan 04, 2011 20:25
ik heb beide manieren geprobeerd maar t werkt niet....
Wat doe ik verkeerd?
Hier is mijn nieuwe css. (mijn divs doen het nu!!!)
en mn html
(die is klein!)
Gloomy kun jij die voor mij centreren?
En nog een vraagje... (ik blijf bezig... we dwalen een beetje af denk ik)
ik wil die footer van copyright wil ik ook verticaal centreren. hoe werkt dat?
Alvast bedankt!
Grtz
ik gebruik trouwens nu google chrome als browser (veel mooier en ietsiepietsie groter
)
Wat doe ik verkeerd?
Hier is mijn nieuwe css. (mijn divs doen het nu!!!)
- Code: Selecteer alles
#header {
position: absolute;
top: 5px;
left: 5px;
width: 980px;
height: 100;
border: 1px solid #F60;
color: #999;
text-align: left;
}
#navigatie {
position: absolute;
top: 110px;
left: 5 px;
width: 200px;
height: 500 px;
border: 1px solid #F60;
color: #999;
text-align: left;
}
body {
font-family: "Arial";
font-size: 14;
}
#contents {
position: absolute;
top: 110px;
left: 210px;
width: 630px;
height: 500px;
border: 1px solid #F60;
color: #999;
text-align: left;
}
#news {
position: absolute;
top: 110px;
left: 845px;
width: 140px;
height: 500px;
border: 1px solid #F60;
color: #999;
text-align: left;
}
#footer {
position: absolute;
top: 615px;
left: 5px;
width: 980px;
height: 35px;
border: 1px solid #F60;
color: #999;
text-align: center;
}
en mn html
- Code: Selecteer alles
<html>
<head>
<title>titel</title>
<LINK href="opmaak.css" rel="stylesheet" type="text/css">
<body>
<div id="header">header</div>
<div id="navigatie">navigatie</div>
<div id="contents">contents</div>
<div id="news">news</div>
<div id="footer">© 2010 | Alle Rechten voorbehouden</div>
</body>
</html>
(die is klein!)
Gloomy kun jij die voor mij centreren?
En nog een vraagje... (ik blijf bezig... we dwalen een beetje af denk ik)
ik wil die footer van copyright wil ik ook verticaal centreren. hoe werkt dat?
Alvast bedankt!
Grtz
ik gebruik trouwens nu google chrome als browser (veel mooier en ietsiepietsie groter
)- webmasterbob
- Berichten: 71
- Geregistreerd op: di dec 21, 2010 21:20
Re: combinatie html met achtergronden
door Gloomy op di jan 04, 2011 21:30
je footer verticaal centreren?
dus over je hele scherm in het midden neerzetten? hmmm.
of wil je de inhoud verticaal centreren? of bedoelde je horizontaal ipv verticaal?
dus over je hele scherm in het midden neerzetten? hmmm.
of wil je de inhoud verticaal centreren? of bedoelde je horizontaal ipv verticaal?
- Gloomy
- Berichten: 2233
- Geregistreerd op: ma feb 25, 2008 10:32
Re: combinatie html met achtergronden
door webmasterbob op di jan 04, 2011 22:19
Hahah sorry ik wist niet dat ik zo onduidelijk was.
Ik wil de tekst die in mijn footer staat verticaal gecentreerd hebben. Nu sast ie helemaal bovenaan....
Nog iets wat me te binnen schiet: hoe kun je er voor zorgen dat je text in een div een aantal px van de kant staat? Bij mij zit ie meteen tegen de linker rand aan.
Grtz
Ik wil de tekst die in mijn footer staat verticaal gecentreerd hebben. Nu sast ie helemaal bovenaan....
Nog iets wat me te binnen schiet: hoe kun je er voor zorgen dat je text in een div een aantal px van de kant staat? Bij mij zit ie meteen tegen de linker rand aan.
Grtz
- webmasterbob
- Berichten: 71
- Geregistreerd op: di dec 21, 2010 21:20
17 berichten • Pagina 1 van de 2 • 1, 2
Wie is er online
Gebruikers op dit forum: Geen geregistreerde gebruikers en 0 gasten
Dit forum is onderdeel van www.Photoshop-Tutorials.nl | Zonvakantie - www. Vakantie Naar De Zon .nl
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
phpBB.nl Vertaling
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
phpBB.nl Vertaling