Div-Tags in DreamWeaver instellen

Een website lay-out bestaat uit een aantal onderverdelingen. Hyper Text Markup Language biedt een aantal elementen en tags gebruikt om te maken van onderverdeling die bestaat uit tabellen, lagen en div-tags. Div-tags in gebruik door de jaren heen vanwege hun flexibiliteit toegenomen. U vindt div-tags in combinatie met Cascading Style Sheet gebruikt voor het opmaken van HTML. Gebruik een programma voor webontwerp zoals Dreamweaver ontwerpt en ontwikkelt websites en pagina's. Dreamweaver bevat vooraf gedefinieerde opdrachten uitvoerbare voor het opzetten van div-tags in uw HTML-website of webpagina.

Instructies

1

Klik op "Start," "Programma's," "Adobe" en klik om te openen "Dreamweaver".

2

Klik op "Bestand" en klik "Nieuw". Selecteer "Blanco pagina" op de linkerkant van het venster 'Nieuw Document' en 'HTML' in het rechterdeelvenster van het venster.

3

Klik op de knop "Create". Dit wordt een leeg scherm weergegeven in Dreamweaver.

4

Een div-tag invoegen in Dreamweaver. Klik op "Insert," "Lay-outobjecten" en klik vervolgens op "div Tag." Dit brengt het vak 'Insert div Tag'.

5

Voer een ID voor uw div-tag in het vak "ID". Een voorbeeld zou uitzien: "myDiv." Klik op 'Weergave' en op 'Code'. Opmerking een vergelijkbaar code < div id = "myDiv" > inhoud voor id "myDiv" gaat hier < / div >

6

Klik op "Venster" en klik vervolgens op "CSS-stijlen." Doe dit als het venster CSS-stijlen nog niet wordt weergegeven op de rechterkant van Dreamweaver.

7

Kijk in de rechterbenedenhoek van het venster "CSS stijlen". Klik op het tweede pictogram op de linker gelabelde "nieuwe CSS-regel" Wanneer gemarkeerd. Dit brengt omhoog de "CSS-regel" venster.

8

Selecteer "Geavanceerd" (IDs, pseudo-klassekiezers) voor het "Selector-Type" en kies de naam van uw div-tag in het vak "Selector". Selecteer de optie 'Alleen dit document' en klik op 'OK'. Dit brengt omhoog de "CSS-regeldefinitie voor [naam van uw CSS]" venster.

9

Selecteren van de verschillende rubrieken op het linkerdeelvenster van het venster CSS definitie en definiƫren van uw div-tags met CSS. Het volgende definiƫren: lettertype, achtergrondkleur, breedte, hoogte, enz.

Hier is voorbeeldcode gegenereerd met behulp van Dreamweaver:

<! DOCTYPE html publiek "-//W3C//DTD XHTML 1.0 Transitional / / nl" "-http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html xmlns = "-http://www.w3.org/1999/xhtml" >

< head >

< meta http-equiv = "Content-Type" content = "text/html; charset = iso-8859-1 "/ >

< titel >< / title >

< stijl type = "text/css" >

{myDiv}

font-family: "Times New Roman", Times, serif;

background-color: #FFFFCC;

height: 100px;

width: 200px;

}

< / style >

< / head >

< body >

< div id = "myDiv" > uw inhoud zou gaan hier, tussen de div-tags < / div >

< / body >

< / html >

CSS de opstellingen van de code van een div-aanroep van "myDiv" in Dreamweaver, vervolgens gebruikt voor het opmaken van haar kenmerken zoals zijn: achtergrond kleur, lettertype, breedte en hoogte.

10

Klik op "File" en vervolgens "Opslaan als" om uw werk op te slaan.

11

Klik op 'File,' 'Preview in Browser' en klik vervolgens op uw Web-browser u wilt bekijken.