Versleep de muiscursor vanuit de gewenste liniaal.
Laatst bijgewerkt op
27 apr. 2021
Gebruik visuele lay-outhulpmiddelen in Dreamweaver, waaronder het instellen van linialen, het instellen van lay-outhulplijnen, richtlijnen voor sjablonen en het gebruik van lay-outrasters, en overtrekafbeeldingen.
Linialen instellen
Linialen helpen je bij het meten, organiseren en plannen van je lay-out. Ze kunnen verschijnen aan de linker- en bovenkant van de pagina, gemarkeerd in pixels, inches of centimeters.
- Om linialen in en uit te schakelen, selecteert u Weergeven > Opties voor ontwerpweergave/verbergen de Opties > Linialen > Weergeven/Verbergen.
- Als u de oorsprong van de linialen wilt wijzigen, sleept u het oorsprongspictogram
(in de linkerbovenhoek van de ontwerpweergave van het documentvenster) naar een andere plaats op de pagina - Als u de standaardpositie van de oorsprong wilt herstellen, selecteert u Weergeven > Opties voor ontwerpweergave > Linialen > Oorsprong herstellen.
- Als u een andere maateenheid wilt kiezen, selecteert u Weergeven > Linialen en vervolgens Pixels, Inches of Centimeters.
Lay-outhulplijnen instellen
Hulplijnen zijn lijnen die je vanuit de linialen naar het document sleept. Ze helpen je om objecten nauwkeuriger te plaatsen en uit te lijnen. Je kunt hulplijnen ook gebruiken om de grootte van pagina-elementen te meten of om de vouwen (zichtbare gebieden) van webbrowsers na te bootsen.
Om je te helpen elementen uit te lijnen, kun je elementen aan hulplijnen uitlijnen en hulplijnen aan elementen uitlijnen. (Elementen moeten absoluut gepositioneerd zijn om de uitlijnfunctie te laten werken.) Je kunt hulplijnen ook vergrendelen om te voorkomen dat ze per ongeluk worden verplaatst door een andere gebruiker.
Horizontale of verticale hulplijn maken
Positioneer de hulplijn in het Documentvenster en laat
de muisknop los (verplaats de hulplijn door deze opnieuw te slepen).
Notitie
Standaard worden hulplijnen vastgelegd als absolute pixelmetingen vanaf de bovenkant of linkerkant van het document en worden ze getoond ten opzichte van de oorsprong van de liniaal.Om de hulplijn als percentage vast te leggen, druk op de Shift-toets terwijl je de hulplijn maakt of verplaatst.
Hulplijnen tonen of verbergen
Selecteer Beeld > Hulplijnen >
Hulplijnen tonen.
Elementen aan hulplijnen vastklikken
- Als u elementen aan hulplijnen wilt vastklikken, selecteert u Weergeven > Opties voor ontwerpweergave > Hulplijnen > Elementen aan hulplijnen vastklikken.
- Als u hulplijnen aan elementen wilt vastklikken, selecteert u Weergeven > Opties voor Ontwerpweergave > Hulplijnen > Hulplijnen aan elementen vastklikken.
Notitie
Als u elementen zoals AP-elementen (met absolute positie), tabellen en afbeeldingen groter of kleiner maakt, worden de desbetreffende elementen automatisch aan de hulplijnen vastgeklikt.
Alle hulplijnen vergrendelen of ontgrendelen
Selecteer Weergeven > Opties voor ontwerpweergave > Hulplijnen > Hulplijnen vergrendelen.
Een hulplijn bekijken en naar een specifieke positie verplaatsen
Houd de muisaanwijzer boven de hulplijn
om de positie te bekijken.
Dubbelklik op de hulplijn.
Voer de nieuwe positie in het dialoogvenster Hulplijn verplaatsen in en
klik op OK.
De afstand tussen hulplijnen weergeven
Druk op Control (Windows) of Command (Macintosh)
en houd de muisaanwijzer ergens tussen de twee hulplijnen.
Notitie
De maateenheid is hetzelfde als de maateenheid die wordt gebruikt voor de linialen.
De vouw (zichtbaar gebied) van een webbrowser nabootsen
Selecteer Weergeven > Opties voor ontwerpweergave > Hulplijnen en selecteer vervolgens een vooraf ingestelde browsergrootte in het menu.
Een hulplijn verwijderen
Sleep de hulplijn uit het document.
Hulplijninstellingen wijzigen
Selecteer Weergeven > Opties voor ontwerpweergave> Hulplijnen > Hulplijnen bewerken, stel de volgende opties in en klik op OK.
Hulplijnkleur
Hier kunt u opgeven welke kleur de hulplijnen moeten hebben. Klik op het kleurstaal en selecteer een kleur uit de kleurkiezer of typ een hexadecimaal nummer in het tekstvak.
Afstandskleur
Specificeert de kleur van de lijnen die verschijnen als afstandsindicatoren wanneer je de muisaanwijzer tussen hulplijnen houdt. Klik op het kleurstaal en selecteer een kleur uit de Kleurkiezer, of typ een hexadecimaal nummer in het tekstvak.
Hulplijnen tonen
Hiermee kunt u de hulplijnen in de ontwerpweergave zichtbaar maken.
Hulplijnen magnetisch maken
Zorgt ervoor dat pagina-elementen vastkleven aan hulplijnen wanneer je elementen over de pagina verplaatst.
Hulplijnen vergrendelen
Hiermee zet u de hulplijnen vast op hun plaats.
Hulplijnen op elementen afstemmen
Als u deze optie selecteert, worden hulplijnen vastgeklikt aan elementen op de pagina wanneer u de hulplijnen versleept.
Alles wissen
Hiermee verwijdert u alle hulplijnen van de pagina.
Hulplijnen met sjablonen gebruiken
Wanneer hulplijnen worden toegevoegd aan een Dreamweaver template, erven alle instanties van de template de hulplijnen.Hulplijnen in sjablooninstanties worden echter behandeld als bewerkbare gebieden, zodat gebruikers ze kunnen wijzigen. Gewijzigde hulplijnen in sjablooninstanties worden hersteld naar hun oorspronkelijke locatie wanneer de instantie wordt bijgewerkt met het hoofdsjabloon.
U kunt ook uw eigen hulplijnen aan exemplaren van een sjabloon toevoegen. Hulplijnen die op deze manier worden toegevoegd, worden niet overschreven wanneer de sjablooninstantie wordt bijgewerkt met het hoofdsjabloon.
Het lay-outraster gebruiken
Het raster toont een systeem van horizontale en verticale lijnen in het documentvenster. Het is handig voor het nauwkeurig plaatsen van objecten. Je kunt absoluut gepositioneerde pagina-elementen automatisch laten uitlijnen op het raster wanneer je ze verplaatst, en het raster wijzigen of het uitlijngedrag regelen door rasterinstellingen op te geven. Uitlijnen werkt ongeacht of het raster zichtbaar is of niet.
Het raster tonen of verbergen
Selecteer Weergeven > Opties voor ontwerpweergave > Raster > Raster tonen.
Vastklikken in- of uitschakelen
Selecteer Weergeven > Opties voor ontwerpweergave > Raster > Vastklikken aan raster.
Rasterinstellingen wijzigen
Selecteer Weergeven > Opties voor ontwerpweergave > Raster > Rasterinstellingen.
Stel de opties in en klik op OK om de wijzigingen toe te passen.
Kleur
Hiermee kunt u de kleur van de rasterlijnen opgeven. Klik op het kleurstaal en selecteer een kleur in de kleurkiezer of typ een hexadecimaal getal in het tekstvak.
Raster tonen
Hiermee maakt u het raster in de ontwerpweergave zichtbaar.
Raster magnetisch maken
Als u deze optie selecteert, worden de pagina-elementen aan de rasterlijnen vastgeklikt.
Tussenruimte
Hiermee stelt u de afstand tussen de rasterlijnen in. Voer een getal in en selecteer Pixels, Inches of Centimeters in het menu.
Weergave
Hier kunt u opgeven of u de rasterlijnen als lijnen of stippen wilt weergeven.
Notitie
Als Raster tonen niet is geselecteerd, wordt het raster niet weergegeven in het document en zijn er geen wijzigingen zichtbaar.
Een overtrekafbeelding gebruiken
Je kunt een overtrekafbeelding gebruiken als hulplijn om een paginaontwerp na te maken dat is gemaakt in een grafische applicatie zoals Adobe Freehand of Fireworks.
Een overtrekafbeelding is een JPEG-, GIF- of PNG-afbeelding die in de achtergrond van het documentvenster wordt geplaatst. Je kunt de afbeelding verbergen, de doorzichtigheid instellen en de positie wijzigen.
De overtrekafbeelding is alleen zichtbaar in Dreamweaver; deze is niet zichtbaar wanneer je de pagina in een browser bekijkt. Wanneer de overtrekafbeelding zichtbaar is, zijn de echte achtergrondafbeelding en -kleur van de pagina niet zichtbaar in het documentvenster; de achtergrondafbeelding en -kleur zijn echter wel zichtbaar wanneer de pagina in een browser wordt bekeken.
Een overtrekafbeelding plaatsen in het documentvenster
Voer een van de volgende stappen uit:
Selecteer Weergeven > Opties voor ontwerpweergave > Overtrekafbeelding > Laden.
Selecteer Bestand > Pagina-eigenschappen en klik vervolgens in de categorie Overtrekafbeelding op Bladeren (naast het tekstvak Overtrekafbeelding).
Navigeer naar het afbeeldingsbestand en klik op OK.
Geef in het dialoogvenster Pagina-eigenschappen de transparantie voor de afbeelding op door de schuifregelaar Transparantie afbeelding te verslepen en klik vervolgens op OK.
Als u een andere overtrekafbeelding wilt kiezen of de transparantie van de huidige overtrekafbeelding wilt wijzigen, kunt u te allen tijde Bestand > Pagina-eigenschappen kiezen.
De overtrekafbeelding tonen of verbergen
Selecteer Weergeven > Opties voor ontwerpweergave > Overtrekafbeelding > Tonen.
De positie van een overtrekafbeelding wijzigen
Selecteer Weergeven > Opties voor ontwerpweergave > Overtrekafbeelding > Positie aanpassen.
Om de positie van de overtrekafbeelding nauwkeurig op te geven, voer je coördinaatwaarden in de tekstvakken X en Y in.
Om de afbeelding 1 pixel per keer te verplaatsen, gebruik je de pijltjestoetsen.
Om de afbeelding 5 pixels per keer te verplaatsen, houd je Shift ingedrukt en druk je op een pijltjestoets.
De positie van de overtrekafbeelding herstellen
Selecteer Weergeven > Opties voor ontwerpweergave > Overtrekafbeelding > Positie herstellen.
De overtrekafbeelding keert terug naar de linkerbovenhoek van het documentvenster (0,0).
De overtrekafbeelding uitlijnen op een geselecteerd element
Selecteer een element in het documentvenster.
Selecteer Weergeven > Opties voor ontwerpweergave > Overtrekafbeelding > Uitlijnen met selectie.
De linkerbovenhoek van de overtrekafbeelding wordt uitgelijnd met de linkerbovenhoek van het geselecteerde element.
Eigenschappen van overtrekafbeelding instellen
Stel eigenschappen in voor een overtrekafbeelding (dit is een afbeeldingsbestand dat als gids wordt gebruikt bij het ontwerpen van je pagina).
Voer een van de volgende handelingen uit:
- Klik op Bestand > Pagina-eigenschappen
- Klik op Venster > Pagina-eigenschappen en klik op Pagina-eigenschappen in de eigenschappencontrole voor tekst.
In het dialoogvenster Pagina-eigenschappen selecteert u Overtrekafbeelding. U kunt de volgende opties in dit deelvenster configureren:
- Overtrekafbeelding: Specificeert een afbeelding die als gids wordt gebruikt voor het kopiëren van een ontwerp.Deze afbeelding dient alleen ter referentie en wordt niet weergegeven als het document wordt weergegeven in een browser.
- Transparantie: Bepaalt de dekking van de overtrekafbeelding, van volledig transparant tot volledig ondoorzichtig.
Prachtige websites ontwerpen in Dreamweaver
Ontwerp, codeer en beheer dynamische websites in een krachtige alles-in-één tool.
