1 van 9 28-4-2010 12:19 Ik wil er nogmaals op wijzen dat als je een wijziging in de pagina aanbrengt het verstandig is om de pagina op te slaan. Dit moet een routine worden zodat je je werk niet steed over hoeft te doen. TIP: Als je op F12 op het toetsenbord drukt dan word er een voorbeeld van de pagina in de webbrouwser geopend. Ook kun je op het wereldbolletje klikken in het menu en een brouwser kiezen om een voorbeeld te bekijken. In mijn geval heb ik 2 brouwsers maar het kan zijn dat jij er maar 1 hebt. Dan gaan we nu verder waar we gebleven waren. Deze les wordt weer een lange les en behandeld een aantal mogelijkheden van Dreamweaver wat afbeeldingen en achtergronden betreft. Een beetje taai wordt het wel maar als je dit goed onder de knie hebt dan gaat het steeds vlotter.

2 van 9 28-4-2010 12:19 We gaan de tabel weer een beetje aanpassen. We gaan de onderste twee cellen, die met het grijze vlakje en die zonder een afbeelding, selecteren. In les 13 heb ik dat besproken hoe je dat doet. Voor het gemak nog een keer. Je gaat met de cursor op de rand staan bij de pijl en dan verschijnt er een pijltje dat naar rechts wijst. Op dat moment klik je en zijn de onderste 2 cellen geselecteerd. Dan vul je bij de H, zie de pijl, in de properties, 100 in en druk je op enter.

3 van 9 28-4-2010 12:19 Je ziet dat de hoogte van de onderste 2 cellen is veranderd, de hoogte is nu 100 pixels. Alle maten die we tot dus ver hebben ingevoerd zijn in pixels en daar hebben we het later nog over. Je hebt nu een idee van hoe een tabel eigenschappen te geven zoals hoogte en breedte van cellen en een afbeelding plaatsen. Dan is het nu tijd voor de uitleg over achtergronden en afbeelding. Het grijze balkje in de linker onderste cel is een afbeelding die 180 bij 10 pixels groot is. De afbeelding heeft dus een vaste maat en moet je zien als een los onderdeel dat in de cel geplaatst is. De afbeelding kun je naar een andere cel slepen en een achtergrond niet. Als je nu op het grijze balkje gaat staan met de cursor en je houd de linker muisknop ingedrukt, je ziet dan een vierkantje verschijnen aan de cursor. Dan sleep je het balkje naar de cel er naast en laat de muisknop los.

4 van 9 28-4-2010 12:19 Je ziet dat het grijze balkje is verplaatst naar de cel er naast en nog geselecteerd is. Klik ergenst in de pagina en de afbeelding is niet meer geselecteerd. We hebben nu de volgende situatie. We gaan nu het grijze balkje als achtergrond gebruiken. Plaatsen van een achtergrond kan weer op en aantal manieren gebeuren. Methode 1: Klik in de linker onderste cel en de cursor knippert in die cel. Klik nu op het mapje, in properties, bij de pijl.

5 van 9 28-4-2010 12:19 Open de map images. Selecteeer de afbeelding left_bar_180_10_background.gif en druk op ok.

6 van 9 28-4-2010 12:19 En dit is het resultaat. Het grijze balkje vult nu de hele cel. Probeer de achtergrond in de linker cel maar eens te verslepen en je ziet dat dat niet gaat. Het grijze balkje is nu een vast onderdeel geworden van de cel. Hoe komt het dan dat de cel helemaal gevuld is met het balkje dat nu als achtergrond dient? Het grijze vlakje wordt nu als het ware gerepeteerd, of te wel herhaald weergegeven zodat de hele cel gevuld wordt met meerder balkjes. Omdat het balkje geheel grijs is valt het niet op dat er meerdere balkjes zich in de cel bevinden. Dit is een eigenschap die je gewoon moet accepteren voor het moment want zelf daar zijn nog mogelijkheden in. Die mogelijkheden worden in latere lessen uitgelegd. Dan gaan we nu de tweede methode om een achtergrond te plaastsen in een cel behandelen.

7 van 9 28-4-2010 12:19 Eerst gaan we de grijze achtergrond verwijderen. Dubbelklik op de naam van de achtergrond in de properties zodat deze geselecteerd is, zie pijl. Dan druk je op delete op je toetsenbord en dan op enter of je klikt ergenst in de pagina. Je ziet dat de achtergrond weg is. Als de cusor niet knippert in de linkse cel dan klik je in de cel zodat de curso knippert. We openen eerst de map images in de Dreamweaver verkenner. Dan zie je een soort wieltje links naast het mapje staan bij pijl 1.

8 van 9 28-4-2010 12:19 Ga daar met de muis opstaan en houd de linker muisknop ingedrukt. Sleep het wieltje op de afbeelding left_bar_180_10_background.gif bij pijl 3 en laat de muisknop los. Bij pijl 2 kun je zien dat er een soort draad aan het wieltje blijft zitten en dat hoort ook zo. Als het goed is gegaan is de achtergrond van de cel weer grijs. Best wel handig dat je op deze manier een achtergrond kunt plaatsen. Dus een achtergrond is aan de cel gebonden en een afbeelding is een los onderdeel dat je kunt verplaatsen. Dit is duidelijk te zien in de 2 cellen, links vult de afbeelding de hele cel en rechts blijft de afmeting van de afbeelding gehandhaaft. Zie het maar als het verschil tussen een muur verven of een schilderij ophangen. Als je de muur hebt geverfd dan moet je als je een andere kleur wilt hebben de muur overschilderen. Als je een ander schilderij wilt ophagen dan haal je de oude er af en hang je een nieuw schilderij op

9 van 9 28-4-2010 12:19 zonder de muur te hoeven bewerken. In de volgende lessen gaan we een menu maken waarmee we verschillende pagina's kunnen openen. Daarmee gaat de website meer structuur krijgen. Belangrijk is dat je de pagina met de tabel, zoals in de laatste les, bewaart om verder te kunnen werken.