Copyright, Mahmud Al Hakim, 2008 1 Lektion 3 Ramar, Navigeringsfält, Lager Mahmud Al Hakim

Slides:



Advertisements
Liknande presentationer
Mahmud Al Hakim IT-Pedagog och Webbutvecklare
Advertisements

Mahmud Al Hakim Lärare - Folkuniversitetet
Grunder i PowerPoint 2000 Skapa en ny presentation Rita egna objekt
Flash CS3 Grundkurs DAG 1 Mahmud Al Hakim Lärare - Folkuniversitetet.
II130V Konstruktion av webbsidor Välkommen till föreläsning 3 September 2007.
FLASH – Lektion 5 Mahmud Al Hakim 1Copyright, Mahmud Al Hakim, 2010.
Excel 2003 Grundkurs Dag 2 Mahmud Al Hakim 1.
MS Excel 2007 Lektion 3 1 Copyright, Mahmud Al Hakim, 2008.
MS Excel 2010 – Dag 2 Mahmud Al Hakim
Programmering B PHP Lektion 4
Programmering B PHP Lektion 1
I NNEHÅLLSHANTERINGSSYSTEM J OOMLA CMS DAG 02 Mahmud Al Hakim
I NNEHÅLLSHANTERINGSSYSTEM J OOMLA CMS DAG 2 Mahmud Al Hakim
5. Grafiska objekt Redan på övning fem av sex! Här handlar det om att rita själv, färglägga och att låta kreativiteten flöda. Något för dig? Ritverktyg.
MS Excel 2007 Dag 1 Lärare: Mahmud Al Hakim. Agenda 1.Börja arbeta med Excel Hantera arbetsböcker 3.Formler 4.Formatera 5.Diagram Att läsa: sid.
MS Excel 2010 – Dag 1 Mahmud Al Hakim. Kursens innehåll 2 DagInnehåll 1 Introduktion till Excel 2010 Hantera arbetsböcker Formler Formatering Litteratur:
I NNEHÅLLSHANTERINGSSYSTEM J OOMLA CMS L EKTION 2 Mahmud Al Hakim
WEBMASTER DAG 4 Mahmud Al Hakim
Mahmud Al Hakim Webmaster DAG 11 VT09 Mahmud Al Hakim
W EBMASTER DAG 8 HT08 Mahmud Al Hakim
Mahmud Al Hakim Webmaster DAG 9 VT09 Mahmud Al Hakim
WEBMASTER DAG 13 Mahmud Al Hakim
Mahmud Al Hakim IT-Pedagog och Webbutvecklare
Mahmud Al Hakim IT-Pedagog och Webbutvecklare
Programmering B PHP Lektion 1 Mahmud Al Hakim Folkuniversitetet
DHTML Designa din egen webbsida.
Excel 2003 Grundkurs Lektion 5 Mahmud Al Hakim 1.
I NNEHÅLLSHANTERINGSSYSTEM J OOMLA CMS L EKTION 1 Mahmud Al Hakim
Excel Kalkylering Fortsättningskurs
DATABASHANTERING för programmerare Lektion 4 Mahmud Al Hakim
Mitt första Java program Mahmud Al Hakim Copyright, Mahmud Al Hakim, 1.
Övning 4 Ritobjekt.
CSS del 3 Kvarnbrinkx Medietyper En XHTML-sida kan ha olika CSS-filer för olika medier! Definieras med attributet “media” i link- taggen,
IT - Lektion 11 MS Excel 2007 –Del 4/5 1 Copyright, Mahmud Al Hakim, 2008.
Copyright, Mahmud Al Hakim, Hakimdata.se Agenda Dokumentkoppling Repetition Frågor och svar.
IT Stöd - Lektion 1 MS Word 2007
2 Agenda 1. Börja arbeta med Excel Hantera arbetsböcker 3. Formler 4. Formatera 5. Diagram 6. Skriva ut 7. Referenser mellan kalkylblad 8. Arbeta.
Webbutveckling Med fokus på grunder i html och css.
XHTML & CSS Introduktion Erik Nahkala
Adobe FLASH - Lektion 01 Mahmud Al Hakim 1Copyright, Mahmud Al Hakim, 2010.
Copyright, Mahmud Al Hakim, Hakimdata.se Agenda 6. Tabeller 7. Objekt 8. Utskrift Att läsa Litteratur: modul 3, sid
Excel 2003 för assistenter Dag 1 Mahmud Al Hakim 1Copyright, Mahmud Al Hakim,
IT - Lektion 8 MS Excel 2007 –Del 2/5 1 Copyright, Mahmud Al Hakim, 2008.
Excel 2003 Grundkurs Lektion 2 Mahmud Al Hakim 1.
IT - LEKTION 14 MS POWERPOINT 2007 – DEL 2. Agenda Copyright, Mahmud Al Hakim, Grafik och diagram 6.
I NNEHÅLLSHANTERINGSSYSTEM J OOMLA CMS L EKTION 3 Mahmud Al Hakim
Dreamweaver fortsättning DAG 2 VT09 Mahmud Al Hakim
Lektion 1 Webbplatsens layout Mahmud Al Hakim Dreamweaver 8 fortsättningskurs 1 Copyright, Mahmud.
FLASH – Lektion 3 Mahmud Al Hakim 1Copyright, Mahmud Al Hakim, 2010.
Excel Kalkylering Fortsättningskurs Dag 2 Folkuniversitetet - Mahmud Al Hakim - 1.
Excel 2003 Grundkurs Lektion 1 Mahmud Al Hakim 1.
FLASH – Lektion 2 Mahmud Al Hakim 1Copyright, Mahmud Al Hakim, 2010.
Dreamweaver fortsättning DAG 1 VT09 Mahmud Al Hakim
Copyright, Mahmud Al Hakim, Hakimdata.se Agenda 1. Ordbehandlingsprogrammet 2. Redigera text 3. Formatera text Att läsa Litteratur: modul 3,
MS Excel 2007 Fortsättning Lektion 2 1 Copyright, Mahmud Al Hakim, 2008.
IT - LEKTION 12 MS POWERPOINT 2007 – DEL 1. Agenda Copyright, Mahmud Al Hakim, Börja arbeta med PowerPoint.
CSS del 2 Kvarnbrink Mer elementreferens ID refererar man till med #-tecken #content { width: 600px; } Klassnamn har en punkt före.newsitem.
Copyright, Mahmud Al Hakim, Hakimdata.se Agenda  Kunskapstest  Windows Skrivbord (Desktop)  Aktivitetsfält  Fönster och menyer  Systemåterställning.
Excel 2003 Grundkurs Lektion 4 Mahmud Al Hakim 1.
Excel 2003 för assistenter Dag 2 Mahmud Al Hakim 1.
Copyright, Mahmud Al Hakim, Hakimdata.se IT - Lektion 8 MS Excel 2007 –Del 1/5.
2 Agenda 1. Börja arbeta med PowerPoint 2. Arbeta med presentationer 3. Formatera 4. Mallar, teman och bildobjekt 5. Grafik och diagram 6. Effekter och.
Figurer.
CSS del 2 Samuel Kvarnbrink
CSS del 2 Samuel Kvarnbrink
Introduktion till CSS CSS1 - EXEMPEL.
CSS del 2 Kvarnbrink
CSS del 1 Kvarnbrink
CSS del 1 Samuel Kvarnbrink
Presentationens avskrift:

Copyright, Mahmud Al Hakim, Lektion 3 Ramar, Navigeringsfält, Lager Mahmud Al Hakim Dreamweaver 8 fortsättningskurs 1 Copyright, Mahmud Al Hakim, 2008

2 Agenda – Ramar Navigeringsfält – 13.45Rast – 14.45Lager (AP-element) 2 Copyright, Mahmud Al Hakim, 2008

3 Repetition Skapa en ny Site Skapa en sidfot med hjälp av en bibliotekspost och formatera den med CSS. Skapa en mall och infoga biblioteksposten i mallen. Skapa en webbsida som bygger på mallen. Uppdatera sidfoten och spara. Vad händer?!

Copyright, Mahmud Al Hakim, Ramar 4 Copyright, Mahmud Al Hakim, 2008

5 Skapa ramuppsättning Metod 1: via ”New Document” 5 Copyright, Mahmud Al Hakim, 2008

6 Skapa ramuppsättning Metod 2: via verktygsfältet Insert 6 Copyright, Mahmud Al Hakim, 2008

7 Skapa ramuppsättning Metod 3: via Modify - Frameset 7 Copyright, Mahmud Al Hakim, 2008

8 Panelen Frames 8 Copyright, Mahmud Al Hakim, 2008

9 Spara ramuppsättning och ramar Markera ramupp- sättningen för att få detta alternativ 9 Copyright, Mahmud Al Hakim, 2008

10 Egenskapskontrollen 10 Copyright, Mahmud Al Hakim, 2008

11 Övning: Skapa en webbplats enligt följande ramuppsättning

Copyright, Mahmud Al Hakim, Infoga Navigeringsfält 12 Copyright, Mahmud Al Hakim, 2008

13 Modifiera Navigeringsfält Copyright, Mahmud Al Hakim,

Copyright, Mahmud Al Hakim, DIV och SPAN DIV och SPAN är "containerelement”. DIV och SPAN används till att omsluta ett område som ska formateras. DIV upptar hela området som ska formateras. SPAN formaterar ett område lika stort som innehållet. 14 Copyright, Mahmud Al Hakim, 2008

15 Övning: DIV och SPAN.border { border: medium double rgb(255,0,0)} en div container en span container 15 Copyright, Mahmud Al Hakim, 2008

16 Infoga Div-taggar

Copyright, Mahmud Al Hakim, Formatera Div-taggar med CSS

Copyright, Mahmud Al Hakim, Lager (AP-element) Ett lager i Dreamweaver är oftast ett AP-element AP-element står för ”Absolut Positionerat element”. Ett AP-element är en div-tagg som har tilldelats en absolut position. Ett lager kan innehålla text, bilder eller annat innehåll. Lager används för att utforma webbsidor. Lager kan placeras framför och bakom varandra. Du kan dölja vissa lager och visa andra samt flytta lager över skärmen. Du kan placera en bakgrundsbild i ett lager. 18 Copyright, Mahmud Al Hakim, 2008

19 Infoga ett lager Copyright, Mahmud Al Hakim, Tips: Ctrl-dra (Windows) om du vill rita flera lager i följd.

Copyright, Mahmud Al Hakim, Lagrets egenskaper Copyright, Mahmud Al Hakim, Layer ID: En identifierare för Lagret som används t.ex. av CSS och JavaScript. L: Left, T: Top, W: Width, H: Height Z-Index: Lagrets ordning i förhållande till andra Lager när de överlappar varandra Tips: Klicka på frågetecknet för mer information.

Copyright, Mahmud Al Hakim, Panelen Layers och CSS Styles Copyright, Mahmud Al Hakim,

Copyright, Mahmud Al Hakim, Ordna flera lager Copyright, Mahmud Al Hakim, Markera flera lager med Skift+Klick

Copyright, Mahmud Al Hakim, Grid (rutnätet) Copyright, Mahmud Al Hakim,

Copyright, Mahmud Al Hakim, Överlappade lager och Z-Index Copyright, Mahmud Al Hakim,

Copyright, Mahmud Al Hakim, Övning: Skapa följande layout m.h.a. tre lager Copyright, Mahmud Al Hakim,

Copyright, Mahmud Al Hakim, Hemuppgifter Utforma en grundmall (template) till din webbplats med hjälp av flera lager. Formatera med CSS. Ange några ändringsbara regioner. Skapa några webbsidor som bygger på mallen. Uppdatera mallen och testa dina sidor i flera webbläsare.