Sådan oprettes absolutte positionerede (AP) divs i Adobe Dreamweaver CS6 - dummies Sådan oprettes absolutte positionerede (AP) divs i Adobe Dreamweaver CS6

Adobe Dreamweaver CS6 bruger CSS-styrede virtuelle beholdere eller bokse, oprettet af DIV-taggen til frit at placere indhold på en side. DIV -tagget er et grundlæggende mærke, der bruges til at oprette områder for indhold på din side.

Du kan oprette DIV-tags fra flere steder i Dreamweaver, herunder Layout-sektionen i Indsæt-panelet. Hvert DIV-tag kan have en unik ID-stil tildelt den til at styre dens position, udseende og størrelse. Processen med at placere indhold kræver ofte to trin: Oprettelse af DIV-tag og derefter oprette dens tilsvarende stil.

Dreamweaver gør denne opgave let med AP Div-værktøjet, som gør det muligt at tegne bokse frit på siden og placere indhold indeni.

CSS behandler de fleste containerelementer på en side som bokse ; Denne fremgangsmåde, der benævnes CSS Box-modellen , gør det muligt for disse elementer at dele ensartede egenskaber såsom polstring, margener, bredde, højde og grænser.

Selvom CSS kan betragte de fleste indholdselementer på en side som en boks (f.eks. En tabel eller en liste), bruges DIV-tags oftest til at oprette virtuelle bokse, som du kan bruge til at placere tekst, billeder og endda indlejret kasser.

Hver kasse kan have sin egen bredde, højde, position (via de øverste og venstre egenskaber), kant, margener og polstring; hver enkelt er indstillet ved hjælp af de relevante CSS egenskaber.

Følg disse trin for at oprette AP (Absolut-Positioneret) Divs:

1. Opret en ny side eller åben en eksisterende side fra dit websted.

2. Vælg indstillingen Kategori på Indsæt-panelet.

3. Vælg tegnet AP Div-værktøjet.

   Markøren vises som et kryds hår, når du flytter det tilbage over siden.

4. Klik overalt på siden og træk for at tegne en ny AP Div; slip museknappen.

   

5. Flyt musemarkøren hen over kanten af ​​kassen, indtil den skifter til en 4-vejs pil; klik en gang og håndtag vises på alle sider.

6. Klik og træk nogen af ​​disse håndtag for at ændre størrelsen på boksen lodret eller vandret.

7. For at flytte boksen skal du klikke og trække den ved fanen, der sidder på den øverste venstre kant, og placer kassen, hvor du vil have den på siden.

   Tag et kig på ejendomsinspektøren, og du ser navnet såvel som mange DIV-ejendomme, der er angivet.

8. Hvis panelet CSS Styles ikke er åbent, skal du vælge Window → CSS Styles for at åbne det; Under panelet Alle klikker du til venstre for stilarket () for at udvide det.

   Du ser en ny # apDiv1 ID-stil, der er knyttet til den nye AP Div, du oprettede. For hver nye DIV oprettet, tildeler Dreamweaver apDiv med et tilsvarende nummer i rækkefølge af oprettelsen.

   

9. Klik i den nye boks for at skrive, indsætte eller indsætte nyt indhold.

Når du tegner en AP Div på siden, opstår der to ting: Dreamweaver indsætter et tag for at oprette kassen og opretter en CSS ID selector, der gemmer DIVs position, bredde, højde og andre egenskaber.

Når du har oprettet en AP Div, kan du skrive, indsætte eller indsætte indhold direkte inde i det. Du kan også tildele en klasse regel til en DIV fra Property inspektøren - oftest til håndtering af indholdsformatering, og lade ID vælgeren kontrollere positionering og dimensioner.