verwijzing naar externe stylsheet

Vragen over html, css en aanverwante onderwerpen die met het maken van 'n site te maken hebben. In principe, vanwege tijdgebrek, alleen over code op deze site, maar je kunt natuurlijk altijd proberen...
Plaats reactie
goodiesetn
Berichten: 2
Lid geworden op: wo 05 jan 2011, 11:44

verwijzing naar externe stylsheet

Bericht door goodiesetn »

<link rel="stylesheet" type="text/css" href="../../css/naam-van-stylesheet.css" />

mag ik vragen eens een vb tegeven waarom en hoe ik die puntjes moet invullen.
ik ben wel geen specialist maar ik zit met die vraag .
bij mij is dat gewoon


<link rel="stylesheet" type="text/css" href="mijnstyl.css"> dus mijn styl is de naam van css. en hetwerkt./de map staat op mijn bureaublad.of documenten
IK denk dat het is omdat mijn styl en htlm en plaatjes in dezelfde map staan.
dit is wel een beginners fout of moeilijk heid denk ik.maar even een vb met klare uitleg helpt zeker en vast.ik ben een rare snuiter wil altyd weten waarom.
Goeroeboeroe
Beheerder
Berichten: 312
Lid geworden op: zo 21 nov 2010, 02:08
Contacteer:

Re: verwijzing naar externe stylsheet

Bericht door Goeroeboeroe »

Altijd willen weten lijkt mij eigenlijk 'n goede eigenschap :D
Er zijn twee manieren om een externe stylesheet te koppelen. Overigens werkt deze naamgeving zo voor álle bestanden, niet alleen voor stylesheets.
De eerste manier is een zogenaamd absoluut pad: de volledige 'route' naar het bestand en de naam van het bestand zelf. Dus bijvoorbeeld:
http://www.example.com/website/teksten/bestand.html
http://www.example.com: zeg maar de naam van de website
website: de naam van de map op example.com waar de site in staat
teksten: de naam van een sub-map binnen /website/ waar de teksten in staan
bestand.html: naam van het uiteindelijke bestand.

Vaak zal daarvoor dan nog de soort protocol staan. Het soort verkeer zeg maar. Bij een website is dat vaak http. Het volledige pad wordt dan http://www.example.com/website/teksten/bestand.html
Bij deze eerste manier werk je dus eigenlijk van boven naar beneden: van site naar map naar sub-map naar bestand.

De tweede manier is een relatief pad. Je gaat dan uit van het bestand en werkt van daaruit naar boven. Je kunt in 'bestand.html' prima het volledige absolute pad zetten. Maar als er iets verandert op de site, bijvoorbeeld de naam van een map, moet je dat pad op élke pagina gaan aanpassen. Bij mij zit, op mijn eigen computer, in het pad de naam 'Documenten'. Die mist op de server waar mijn site staat, want daar is geen map 'Documenten'.
Om dat op te lossen maak je gebruik van een relatief pad. Relatief ten opzichte van het bestand waar je mee werkt.

../../bestand.html is zo'n relatief pad.
../ wil zeggen: ga één map omhoog.
Je gaat dus van bestand.html naar de map 'teksten'.
En omdat er twee keer ../ staat, ga je nóg 'n map omhoog, naar 'website'.
../../bestand.html wordt dus gewoon veranderd in website/teksten/bestand.html

Het is bij iets grotere sites een goede gewoonte om de bestanden in mappen te zetten, Bij duizenden bestanden in één map wordt alleen de fabrikant van kalmeringsmiddelen gelukkig.
Stel dat op example.com een map staat met teksten, en een map met css. De map /teksten/ staat zelf weer binnen een map /website/
Binnen de map css staat stijl.css, en dat wil ik koppelen aan bestand.html.
/website/ en /css staan in de root: de hoofdingang van de server, waar ook index.html staat, het bestand dat automatisch opent als iemand de site bezoekt.
[pre]example.com -- index.html
|---- /website/
| |----- /teksten/
| |----- bestand.html
|----/css/
|-----stijl.css[/pre]

Het relatieve pad vanuit bestand.html om stijl.css te koppelen wordt dan vanuit bestand.html:
../../css/stijl.css
Dus de volledige regel:
<link rel="stylesheet" type="text/css" href="../../css/stijl.css" />
../ Ga vanuit bestand.html 1 map omhoog. Dan zit je in /website/ (bestand.html staat zelf in /teksten/)
../ Ga vanuit /website/ 1 map omhoog. Nu zit je in de 'root', de hoofd-ingang.
/css Ga vanuit die root weer omlaag, de map /css/ in.
/stijl.css Gebruik in die map het bestand stijl.css

Bij meer of minder mappen neemt het aantal keren ../ toe of af.
Dit werkt vaak veel beter dan een absoluut pad, omdat de namen in een computer meestal heel anders zullen zijn dan op een server. Ik geef nu gewoon aan dat er twee mappen omhoog gegaan moet worden, ongeacht de namen van die mappen. Dat er in mijn computer dus 'Documenten' in het pad zit, maakt niets meer uit.

./ (één punt) wil zeggen: in deze zelfde map. Als stijl.css en bestand.html bij jou in dezelfde map staan, werkt dat dus.
Meestal kun je ./ gewoon weglaten als het in dezelfde map staat.
Hoop dat dit 'n beetje duidelijk is.
Plaats reactie