Robby schreef:- Ik probeer de kopjes met H1 t/m H6 te gaan doen. Maar waar kan ik in Nvu de default-waarden van die kopjes veranderen? Ik wil bv het lettertype van H2 veranderen in Comic Sans met grote 12 en H3 in arial 12 cursief.
Allereerst even een waarschuwing: kijk heel erg uit met verschillende lettertypes op 1 pagina. Het geheel kan er namelijk erg onrustig op worden. Uiteindelijk dient een webpagina voor het overbrengen van informatie en daarbij kun je beter niet afleiden met allerhande goedbedoelde lettertype-wisselingen. Het is dan beter om 1 lettertype in diverse groottes en diktes af te wisselen.
Een waarschuwing tegen het gebruik van Comic Sans staat hier:
http://www.bancomicsans.com/home.html
En binnenkort hier:
http://www.bancomicsans.nl/
Dan gaan we nu over naar de stylesheets (kortweg CSS), want daar heb je het nu in feite over. Daarmee kun je 2 kanten op:
1) aan een bepaald element (zoals h1, h2, etc) een nieuw betekenis toekennen
2) zelf nieuwe stijlen definieren
Je vraagt nu om het eerste, dus laten we daar maar eens mee beginnen in Nvu. Om te beginnen start je Nvu en plaats je op de pagina diverse alinea's met tekst. Van de eerste alinea maak je een h1, van de tweede een h2, enz.
Dan ga je naar het menu Extra en kies je voor de CSS-editor (of hoe die in de Nederlandse vertaling heet). Om jezelf niet in verwarring te laten brengen, kun je het beste het vinkje onderaan bij Expert Mode uit zetten. Dan blijft onderaan enkel het knopje Rule (Regel ?) over. Klik daar dus maar eens op.
Nu zie je aan de rechterkant dat je de keuze hebt die ik hierboven ook heb beschreven (maar dan net in de andere volgorde):
1) een nieuwe klasse aanmaken
2) een stijl toepassen op een bestaand element
Je kiest nu dus voor de 2e optie en vult het element in dat je wilt veranderen (bijvoorbeeld
h1).
Dan klik je op de knop die zich daaronder bevindt (Create Style Rule in mijn Engelse versie).
De nieuwe CSS-regel verschijnt dan een de linkerkant en met de tabbladen aan de rechterkant kun je bepalen wat ermee moet gebeuren. Je ziet al snel dat je daar erg veel dingen kunt instellen. Verander in eerste instantie enkel het lettertype en dan zul je al snel de smaak te pakken krijgen.
Heb je op deze manier enkele stijlen ingericht, dan wil je die misschien ook weer op een andere pagina kunnen hergebruiken. Een website bestaat doorgaans namelijk uit meerdere pagina's en de kracht van CSS is dat je stijlen kunt delen over meerdere pagina's.
Daarom kun je deze stijlen ook naar een extern CSS-bestand exporteren (en die vervolgens weer aan deze pagina linken). Ook daarbij helpt Nvu je. Klik maar eens op het bovenste element in de lijst aan de linkerkant (van de CSS-editor). Dat heet bij mij "internal stylesheet", maar zal in het Nederlands iets zijn van "intern stijlblad" ofzo. Aan de rechterkant staat dan een knop waarmee je de stijlinformatie als een bestand kunt exporteren.
In mijn geval wordt er dan in de code een verwijzing gemaakt in de trant van "file:///C:/". Dat moet je in elk geval zien te voorkomen, want dat is een absolute verwijzing naar een bestand op jouw eigen PC. De enige die dat uiteindelijk kan zien dat ben jijzelf en het is toch de bedoeling dat de pagina er hetzelfde uit ziet voor anderen die straks jouw website komen bezoeken. Daarom is het op dit moment aan te bevelen om het CSS-bestand te exporteren naar dezelfde map als waar je je webpagina opslaat. Dan hoef je namelijk niet een heel pad op te geven naar waar het CSS-bestand zich bevindt en hoef je enkel de bestandsnaam van het CSS-bestand op te geven.
Al met al moet ik zeggen dat de CSS-editor van Nvu best wat meer gebruikersvriendelijk mag worden. Ik vind het iets te zeer opgezet vanuit de CSS-techniek. Maar als je je daar een beetje van bewust bent en weet welke mogelijkheden CSS zo ongeveer heeft, dan kan deze CSS-editor je zeker helpen bij het opstellen van een CSS-bestand. Handig is ook dat je direct ziet welk effect een bepaalde wijziging in de stijlen op de webpagina heeft. Zo zie je snel genoeg of een bepaald wijziging het gewenste effect heeft.