Programmeringteknik Webbdelen. HTML H yper T ext M arkup L anguage Märker upp sidans innehåll så att webbläsaren kan avgöra hur innehållet ska visas.

Slides:

Advertisements

Liknande presentationer

Fatta PHP - Din guide till en större värld Knut Hahnsskolan – Ronneby Virtuella miljöer (MUM1203, 100p) Fredrik JohanssonBild 1 av 10.

Advertisements

Namn på tillfället (kan skrivas på två rader) Namn på den som presenterar Datum för tillfället.

Mina Aktiviteter Integration med befintliga webbplatser.

HTML - grunder. Program •Html kan skrivas i anteckningar, eller vilket annat textbehandlingsprogram som helst. Mitt tips: Notepad ++ Notepad ++ •Grafiska.

HTML – vad är det och varför ska vi använda det Och vad är XHTML.

Datavalidering med JavaScript

II130V Konstruktion av webbsidor Välkommen till föreläsning 3 September 2007.

Manual: Att skapa en ny händelse (Tryck på F5 för att se PP-presentationen)

1 MSPEL Föreläsning 1 DSV Peter Mozelius XML, XHTML, CSS och Java applets.

Introduktion till CSS CSS1 - EXEMPEL. Denna webbsida vill vi kopiera och förbättra.

Enkel dator teknik Tips och tricks.

XHTML 1 Designa din egen webbsida. Idag  Struktur och uppmärkning  Vad är (X)HTML?  Element, taggar och attribut  Validering.

Programmering?. Förslag till innehåll programmeringens grundläggande teori webbredigering, webbprogrammering html xml wml (wap 1) xhtml css javascript.

Manual: Att skapa en ny sida. (Tryck på F5 för att se PP-presentationen)

DCV Idéskiss Design Jag tror att jag ska ha en mörk och stilren design på mitt DCV. Det ska finnas dynamisk funktionalitet där designen byts utan att sidan.

HEAD – HUVUDET I huvudet hittar du information om dokumentets titel, sökord, referenser till stildokument och annan information som normalt inte visas.

Webbteknik En kort introduktion. Innehåll Historisk återblick Tim Berners Lee 1992 Teknisk beskrivning Märkspråk Standardisering Trender.

HTML – vad är det och varför ska vi använda det

Webbutveckling grundkurs DA7710

Programmeringsteknik för K och Media

Webbteknik lektion 2 Det handlar om stilmallar Per K, 2012.

XHTML och CSS En föreläsning om webbteknik , SK, PK TFE Umeå Universitet.

Webbteknik En kort introduktion. Innehåll Historisk återblick Teknisk beskrivning Märkspråk Standardisering Trender.

Föreläsning 5 Python: argument från kommando-tolken

Föreläsning 8 Appletprogram/fristående grafiska program Rita linjer, rektanglar mm Skriva text Byta färg Appletprogram html.

Stilark: CSS Digitalisering av text April 2005 Mats Dahlström.

WEBMASTER DAG 4 Mahmud Al Hakim

Lägga in ett PM – så här gör man…

Cirkelledarutbildning

DHTML Designa din egen webbsida.

Min första hemsida Hello world!. Byt bakgrundsfärg Hello world!

Links2keep - Nyb ö rjarguide. Links2keep Här kommer alla dina länkar att visas. Länkarna som du kan se på startsidan är exempel och kommer inte finnas.

1 ITK:P2 F2 Stilsättning av XHTML DSV Peter Mozelius.

(Cascading Style Sheets) Rebecca Landmér 2007 CSS.

CSS del 3 Kvarnbrinkx Medietyper En XHTML-sida kan ha olika CSS-filer för olika medier! Definieras med attributet “media” i link- taggen,

Knappar i artikelredaktionen som formaterar texten:

Webbutveckling Med fokus på grunder i html och css.

XHTML och något om CSS Produktion för tryckta Webbutveckling Kvarnbrink

XHTML & CSS Introduktion Erik Nahkala

TEXT – GRUNDERNA Det huvudsakliga innehållet i XHTML- dokument är text – brödtext, rubriker, avgränsande linjer.

W EBBUTVECKLING, HT 2013 En webbplats Källa: pragmatisk.se.

Webbsidesutbildning Lennart Ek, Tel Stefan Fosseus,

XHTML – Dokumentets grundstruktur Body - head. Grundläggande dokument

UTVECKLING MED RAMVERKET.NET Marcus Medina. Dagens visdomsord ”Google is your friend”

Dreamweaver fortsättning DAG 1 VT09 Mahmud Al Hakim

Föreläsning 13 Appletprogram/fristående grafiska program Arv Rita linjer, rektanglar mm Skriva text, byta färg Appletprogram & HTML Grafiska användargränssnitt.

Moment 2 Mall för presentation av idé

2I1073 Lektion 1 KTH-MI Peter Mozelius XHTML, stilmallar och Javascript.

1 2I1073 Föreläsning 1 KTH-MI Peter Mozelius XHTML, stilmallar och Javascript.

CSS del 2 Kvarnbrink Mer elementreferens ID refererar man till med #-tecken #content { width: 600px; } Klassnamn har en punkt före.newsitem.

CSS del 1 Kvarnbrink I början… Bakgrunden var det enda man kunde byta färg på Allt var satt i Times Texten flödade över hela webbläsarfönstrets.

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

CSS del 3 Samuel Kvarnbrink Medietyper En XHTML-sida kan ha olika CSS-filer för olika medier! Definieras med attributet “media” i link- taggen,

ATT SKAPA TABELLER Tabeller skall endast användas om man verkligen vill presentera något i tabellform Använd INTE tabeller för att strukturera hela sidor.

Textkodning 1 Dokumentrepresentation. Idag  Struktur och uppmärkning  Vad är (X)HTML?  Element, taggar och attribut  Standarder.

Programmeringteknik Webbdelen 2. webbprogrammering Server Den dator som websidan ligger på Klient Dator som tittar på webbsidan med en webbläsare (t ex.

Enkel dator teknik Tips och tricks. Välja storlek och radavstånd Här väljer du storlek på texten vi vill att ni använder 14 p till rubriker och 12 p till.

Webbteknik En kort introduktion. Innehåll Historisk återblick Tim Berners Lee 1992 Teknisk beskrivning Märkspråk Standardisering Trender.

Framsida på omslag och ett uppslag

Utbildning Karlstad, SFAI-veckan.

CSS del 2 Samuel Kvarnbrink

CSS del 2 Samuel Kvarnbrink

CSS del 3 Samuel Kvarnbrink

Introduktion till CSS CSS1 - EXEMPEL.

PostNord Strålfors Oy Materialanvisning för utskriftsproduktion

CSS del 2 Kvarnbrink

CSS del 1 Kvarnbrink

Internet A HTML Grunder

CSS del 1 Samuel Kvarnbrink

Presentationens avskrift:

Programmeringteknik Webbdelen

HTML H yper T ext M arkup L anguage Märker upp sidans innehåll så att webbläsaren kan avgöra hur innehållet ska visas. Taggar omgivna av <> Ofta start- och sluttaggar, exempel: Fetstil (bold)

HTML-FILENS DELAR En webbsida kan innehålla följande delar: doctype-rad teckenkodningsinformation stilmall element (taggar med innehåll) text specialtecken kommentarer

DOCTYPE Doctype-raden talar om vilken typ av dokument det är. Den ska stå allra först och ser normalt ut så här: Denna rad syns inte när webbläsaren visar upp filen.

TECKENKODNING Om man inte skriver allt på engelska är det extra viktigt att ange teckenkodning. Denna rad ska stå direkt efter :...där UTF-8 gäller på Ubuntu i labbsalarna (byt mot latin1 i Windows) Denna rad syns inte när webbläsaren visar upp filen, men den ser till att å,ä och ö bli rätt!

STILMALL En stilmall (stylesheet) är en separat fil med info om typsnitt, färger mm Denna rad ska också ligga under : stil.css Här är stil.css namnet på stilmall-filen. CSS (=Cascading Style Sheets) är språket som stilmallen beskrivs i.

ELEMENT Huvuddelen av html-filen består av element. Ett element är (oftast) starttag + innehåll + sluttag, t ex denna text skrivs ut precis som den ser ut här - radbyten också

VOID-ELEMENT Det finns även element som enbart består av en tag, tex som lägger in en bild på sidan.

ATTRIBUT Attribut i html fungerar som parametrar till elementet. Det ser ut som när man skickar med default-parametrar i Python: attributets namn = värde Exempel: Här är src, alt, height och width namnen på attributen. "katt.jpg", "söt katt", "50 och "38" är värden.

TEXT De flesta element innehåller text (där taggen talar om hur texten ska tolkas/visas av webbläsaren) Stor rubrik Mindre rubrik Första punkten Andra punkten

SPECIALTECKEN Specialtecken skrivs med inledande & Några exempel: i html-filenvisas i webbläsaren < < > > x x x

KOMMENTARER Kommentarer skrivs inom Exempel:

HTML - LÄNKAR I länk-taggen skriver man * webbadressen till den andra sidan (här fil på samma katalog) * den text som ska visas annan sida

CSS C ascading S tyle S heets Används för att ange hur olika element på webbsidan ska se ut. Hämta in i html-filen så här: pynt.css

CSS - EXEMPEL body { color: Darkblue; background: Lightblue; }