1. XHTML. Innhold Innledning
|
|
- Christian Berger
- 7 år siden
- Visninger:
Transkript
1 Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag XHTML Lene Hoff Lærestoffet er utviklet for faget XML Teknologi 1. XHTML Resymé: I denne leksjonen skal vi ta for oss standarden XHTML. Det er mange likhetstrekk mellom XHTML og XML, og flere av de regler som gjelder for XML vil også gjelde for XHTML. Innhold 1.1. INNLEDNING LAGE ET XHTML-DOKUMENT OVERSIKT OVER XHTML-SYNTAKS XML-deklarasjonen Dokument Type Deklarasjonen (DTD): XHTML Rotelementet og navnerom Velformede dokumenter BARNEELEMENTER TIL BODY-ELEMENTET Overskrifter Paragrafer Lister KJERNEATTRIBUTTENE TIL XHTML ANDRE ELEMENTER XHTML TABELLER KNYTTE STILARK OPP MOT ET XHTML-DOKUMENT Innledning HTML står for Hypertext Markup Language og brukes til å lage websider på Internett. Det er et fastsatt sett med elementer som programmereren kan velge mellom når websidene utvikles. Dermed vet nettleseren hvordan websiden skal se ut. Det medfører at HTML er mest egnet for presentasjon av tekstdokumenter. Etter hvert som HTML har utviklet seg, har selve HTMLkoden blitt rotete og mange hjemmesider er dårlig programmert. Det er ikke alltid så nøye med selve syntaksen da nettleserne likevel kan vise hjemmesiden. Det har etter hvert ble det behov for en standard for å representere selve dataene, og ikke bare for å presentere dem. Her kommer XML (Extensible Markup Language) inn. Programmereren kan selv lage de elementer han måtte ønske. Dermed kan en blant annet beskrive flere typer dokumenter i XML sammenlignet med HTML, som vi så i leksjon 1 og 2.
2 XHTML side 2 av 8 Støtten for XML utvides hele tiden og det er fortsatt et stykke igjen før det er ferdig utviklet. I mellomtiden ble en ny standard introdusert; XHTML. Denne standarden følger de strenge reglene til XML for oppsett av et dokument og et XHTML-dokument kan grovt sett betraktes som et XML-dokument. Med de tre standardene som her er presentert; HTML, XML og XHTML snakker en om: - Semantikk: refererer til meningen med innholdet og de ulike måtene informasjonen kan tolkes, hentes ut og manipuleres. - Syntaks: beskriver formen på dokumentet, altså hvordan det er organisert. Strukturen kan vi ofte se i et hierarkisk tre for dokumentene. - Stil: går på hvordan dokumentet er presentert. Vi vil nå gå over på XHTML. XHTML består av tre anbefalinger som er laget av W3C: 1. XHTML 1.0: gjelder for den siste versjonen av HTML XHTML 1.1 Modularization: utvider XHTML 1.0 slik at det kommer nærmere XML og gir derfor bedre overgang til nye plattformer. De elementer i HTML 4.0 som etter hvert vil forsvinne, deprecated, er ikke inkludert. 3. XHTML Basic: er et sett med moduler som brukes for blant annet mobiltelefoner, PDA, TV og lignende. Som med XML-dokumenter er elementer også veldig viktig i XHTML-dokumenter. XHTML-elementer er også case-sensitive. Det vil altså si at det skilles mellom store og små bokstaver. Dermed vil <title> være ulik fra <TITLE>. Alle elementer må ha både et startmerke og en sluttmerke, med unntak av tomme elementer (elementer uten innhold): <p>her kommer det innhold</p> <hr /> - element med innhold - tomt element
3 XHTML side 3 av Lage et XHTML-dokument I teksteditoren din skriver du inn følgende tekst: <?xml version ="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " <html xmlns=" xml:lang="en" lang="en"> <head> <title>praktisere XHTML</title> </head> <body> <h1>semantikk, Struktur, Stil</h1> <h2>xhtml gir strukturen </h2> <h3>css gir stilen</h3> </body> </html> Lagre filen som Intro.html (eller Intro.htm). Nå kan du åpne dokumentet ditt i en nettleser. Det vil se ut som: 1.3. Oversikt over XHTML-syntaks XHTML-dokumentet består av følgende deler: 1. XML-deklarasjonen. 2. DOCTYPE. Gjør at dokumentet må være i henhold til en DTD 3. Rotelementet. Rotelementet til XHTML-dokumenter er html. Innenfor dette elementet har vi head, body, script Nå vil vi gå gjennom delene fra eksemplet i kap XML-deklarasjonen XML-dokumenter begynner alltid med en XML-deklarasjon. Denne deklarasjonen er valgfri i XHTML, men ble brukte i eksemplet over: <?xml version="1.0"?> Denne deklarasjonen må stå helt først og forteller nettleseren at dette er et XML-dokument. Hvis du vil bruke et annet tegnsett enn det som er standard, må denne deklarasjonen være med.
4 XHTML side 4 av Dokument Type Deklarasjonen (DTD): XHTML 1.0 Den andre linjen i eksemplet over var: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " Denne linjen deklarerer dokumenttypen (DTD). En DTD viser strukturen til et dokument og definerer alle elementer og attributter som kan brukes. XHTML 1.0 har tre ulike DTD er: - Strict XHTML 1.0: dette er en streng versjon av XHTML 1.0. Den har ikke med de elementer som er deprecated (skal fjernes). Videre tilbyr den en ren og strukturert kode uten noen formateringer (stiler). <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " - Transitional XHTML 1.0: inkluderer alle elementer og attributter, også de som er deprecated. Her kan man ha interne stilark og små justeringer på stil for de enkelte elementer (bra ved eldre nettlesere). <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " - Frameset XHTML: for dokumenter som bruker frames. Frames er ikke støttet i XHTML Basic og vil ikke bli støttet i fremtidige XHTML-versjoner. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" " I eksemplet over så du at vi inkluderte dokumenttypen Strict HTML. Det betyr altså at XHTML-dokumentet bare kan bruke de elementer som ikke er deprecated og kan heller ikke inkludere noen interne stiler. Når et dokument er knyttet opp mot en DTD vil det si at dokumentet er gyldig (valid) Rotelementet og navnerom Den neste linjen var: <html xmlns=" xml:lang="en" lang="en"> Her ser du at html-elementet er rotelementet i XHTML-dokumenter. Videre er det satt et navnerom for XHTML-dokumentet for å knytte det opp mot de gjeldende standardene. Vi husker navnerom fra leksjon 2. Her er navnerommet til XHTML satt som default, noe som gjør at alle elementene som brukes i dokumentet vil bli knyttet opp mot dette navnerommet. Kort oppsummerte betyr de ulike delene: - alle XHTML-dokumenter har html som rotelement - xmlns er ordet som brukes for å spesifisere et navnerom - er URI en til navnerommet - xml:lang= en lang= en spesifiserer språket (language) og en står for engelsk (english). Begge to må være med.
5 XHTML side 5 av Velformede dokumenter Vi bruker begrepet velformet også om XHTML-dokumenter. Vi sier at XHTML-dokumenter er velformede hvis de følger disse kriteriene: 4. Elementene må være riktig nøstet 5. I XHTML-dokumenter skal navn på elementer og attributter være i små bokstaver 6. Elementer som ikke er tomme må ha en sluttmerke 7. Verdiene på attributtene må være omsluttet av 8. Attributt-verdi par må skrives fullstendig (spesifiserer dette senere) 9. Tomme elementer må enten ha med en sluttmerke, ellers må startmerket slutte med /> 10. Unngå flere mellomrom etter hverandre i attributtverdier siden disse blir behandlet ulikt av programmer som bruker dokumentet 11. Ikke bruk < eller & i script, eller style-elementer da dette vil bli sett på som start til elementer 12. Det er ikke lov å droppe ut elementer 13. I XHTML er id-attributtet definert til å være av typen ID. Det skal brukes for å definere fragment identifiseres og verdien skal være unik i dokumentet Barneelementer til body-elementet Nå er vi klare for å legge til elementer i body-elementet. Det er viktig at elementene blir korrekt nøstet, som med XML. Her et eksempel hvor dette er tilfelle: <partnumber> <partname>...</partname> </partnumber> <ol> <li>...</li> </ol> Det er ikke lov å for eksempel avslutte ol-elementet før li-elementet er avsluttet. Tre av de vanligste elementene som brukes er; overskrifter, paragrafer og lister. Vi vil nå beskrive raskt hva disse gjør. For de fleste elementene her er det gode eksempler på i boken fra side 556. Av den grunn vil det bare komme en kort beskrivelse av dem her Overskrifter For å fremheve de ulike overskriftene i en tekst brukes elementene h1 til h6, hvor h1 er den største overskriften og h6 er den minste overskriften. Der indeksen h er forkortelsen for header Paragrafer For å lage paragrafer av tekst (avsnitt) brukes p-elementet. Da vil det komme et linjeskift før og etter paragrafen. Hvis det bare ønskes et enkelt linjeskift kan br-elementet istedenfor (<br/>).
6 XHTML side 6 av Lister Man har tre typer lister: - Usorterte lister (bulleted lists). Begynner med et ul-element som forteller at alle lielementene som kommer som barn skal ha en runding foran seg. - Sorterte lister har nummer foran seg. Her brukes ol-elementer med li-elementer som barneelementer - Definisjons lister er lister over termer som har en beskrivelse. Her er dl-elementet som forteller at hver enkelt term definert i dt-element, og med tilhørende beskrivelse innenfor et dd-element, skal bli formatert på en bestemt måte Kjerneattributtene til XHTML Attributter gir tilleggsinformasjon til elementer som kan brukes ved datamanipulering og formateringer. Det er plassert i elementets startmerke og står på følgende form: navn = verdi Alle attributter har et navn og den tilhørende verdien skal stå i anførselstegn ( ). Unngå linjeskift og flere mellomrom i verdien da dette vil bli behandlet ulikt. XHTML har fire universale attributter; - id: identifiserer et unikt navn for et element i et dokument. Verdien må være unik i dokumentet (i HTML er det mulig å ha flere id-attributter med samme verdi, men det er ikke i henhold til XHTML-standarden) - class: identifiserer en eller flere klasser som et element hører til. Kalles også for kategorier eller grupper. Et bruksområde er å sette en bestemt stil (formatering) på en klasse. Dermed vil alle elementer i denne klassen få denne stilen. - style: legger formateringsinformasjon direkte på et element. Det er ikke anbefalt å bruke dette attributtet. Formateringer bør heller legges i et eget stilark - title: gir en beskrivende tekst til et element eller dens innhold. Eksempel her kan være tool tip (f.eks. tekst som kommer opp når musmarkøren er over elementet). Man kan også legge til andre attributter. Vil da gjøre oppmerksom på at attributter som er knyttet til stil/formatering er deprecated og vil ble fjernet i senere standarder. Skrivemåten til attributtene vil være likt som tidligere Andre elementer I læreboken på sidene står det om flere ulike elementer som kan brukes innenfor body-elementet. De fleste av disse kjennes igjen fra HTML og vil ikke bli så nøye gjennomgått. Her kommer en kort beskrivelse på noen av dem: - a: brukes for å spesifisere en hyperlenke. Elementet kan inneholde tekst, bilde eller begge deler. Det består av en URL til ressursen man lenker til, og denne kan enten være relativ
7 XHTML side 7 av 8 eller absolutt. I tillegg kan man også referere til bestemte deler av dokumentet ved å bruke id-attributtet. - img: brukes for å sette inn bilder på websiden. En URL brukes for å fortelle hvor bildet ligger. - br: for å sette inn linjeskift(enter) eller blanke linjer i dokumentet. Dette er et tomt element. - div: brukes for å strukturere XHTML-dokumentet i unike seksjoner/divisjoner. Dette er fint for å legge til formateringer og posisjonering av deler av en tekst. Kan sammenlignes med p-elementet, men div-elementet kan bestå av større deler av dokumentet - span: ligner på div-elementet men span identifiserer tekst innenfor andre elementer. F.eks. kan den identifisere en liten tekst innenfor p-elementet XHTML Tabeller Tabeller er en fin måte å lese relaterte data på og er mye brukt. Tabeller i XHTML er konstruert rad for rad. Tabeller brukes en del til sidelayout, men dette er ikke anbefalt. Her er en oversikt over de elementer som er knyttet til tabeller: - table: definerer hele tabellen og er topp elementet til tabellen. - caption: spesifiserer tittelen til tabellen og kan stå over, under, til høyre eller til venstre for tabellen. En tabell kan bare ha et caption-element. - tr (table row): definerer en enkelt rad i tabellen - th (table heading): definerer en overskriftscelle og må stå innenfor et tr-element - td (table data): definerer en celle med data innenfor en rad En tabell kan se ut som (figuren til høyre har ikke nødvendigvis de rette formateringer): <table> <tr> <th>fornavn</th> <th>etternavn</th> </tr> <tr> <td>per</td> <td>olsen</td> </tr> <tr> <td>kari</td> <td>larsen</td> </tr> </table> Les mer om tabeller på side Fornavn Per Kari Etternavn Olsen Larsen
8 XHTML side 8 av Knytte stilark opp mot et XHTML-dokument I leksjon 3 så vi hvordan stilark, som CSS, kunne knyttes opp mot et XML-dokument. I XHTML finnes det et tilsvarende element som gjør at et stilark kan brukes mot dokumentet. Det ser ut som følger: <link rel= stylesheet type= text/css href= stilark.css /> Her har vi et link-element får å koble dokumentet opp mot et stilark. Attributtet rel forteller hvilken type kobling det er snakk om, her stilark. De to neste kjenner vi igjen fra XMLdokumentet. Dette link-elementet skal plasseres i head-elementet til XHTML-dokumentet. Side 576 og utover i kapitlet er ikke pensum.
1. Lage og vise et enkelt XML-dokument
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Lage og vise et enkelt XML-dokument Lene Hoff (revidert av Tore Mallaug) 1.9.2013 Lærestoffet er utviklet for faget XML Teknologi 1. Lage
Detaljer1. Mer om oppbyning av XML-dokument
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Mer om oppbyning av XML-dokument Lene Hoff 2.9.2013 Lærestoffet er utviklet for faget XML Teknologi 1. Mer om oppbyning av XML-dokument Resymé:
DetaljerNettsider og XHTML. SGML-familien. Hvordan lage et nettsted
Nettsider og XHTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1- strict.dtd"> En minimal nettside Hallo, verden!
DetaljerMMT105 Internettprogrammering Uke 44, høst 2007
MMT105 Internettprogrammering Uke 44, høst 2007 Introduksjon til CSS MMT105 HiNT 2007 1 HTML-elementenes strukturerende egenskaper HTML-elementene skal markere strukturen i et webdokument, dvs. at de forskjellige
DetaljerLæringsmål XML. Markering av tekst. SGML-familien. Forstå prinsippene bak XML og XHTML. Forstå hva XML kan brukes til og hvordan.
Markeringsspråk og XML Læringsmål XML Forstå prinsippene bak XML og XHTML. Forstå hva XML kan brukes til og hvordan.
Detaljer1. XML Grunnlag
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag XML Mildrid Ljosland 4.2.2008 Lærestoffet er utviklet for faget LO701D Interaktive Webtjenester med Java og XML 1. XML Resymé: Webtjeneste-teknologien
DetaljerGrunnleggende om websider og HTML-kode
Grunnleggende om websider og HTML-kode Html er et språk / en standard som brukes for å gi instrukser til nettlesere om hvordan ulike elementer på en webside skal fortolkes og presenteres for en sluttbruker.
DetaljerIntro til WWW, HTML5 og CSS
Intro til WWW, HTML5 og CSS Håkon Tolsby 20.08.2015 Håkon Tolsby 1 World Wide Web Webserver: Programvare som distribuerer websider og/eller maskin hvor programmet kjører Webbrowser (nettleser): Program
DetaljerMarkeringsspråk og XML Nettsider og XHTML
Markeringsspråk og XML Nettsider og XHTML Det var en gang og snipp, snapp, snute, så var det eventyret ute. Læreboka kapittel 3 og 4 5. september 2007 XML og XHTML XML = EXtensible
DetaljerXML og XHTML. Hva er nå egentlig denne teksten? Et litt mer avansert XML-eksempel. Et meget enkelt XML-eksempel. For å få fortalt hva teksten er
Hva er nå egentlig denne teksten? XML og XHTML jfr. Cyganski avsnitt 2.4 2.7 Skagestein: Systemutvikling fra kjernen og ut, fra skallet og inn kapittel 13 http://www.w3schools.com/xml/ default.asp http://www.w3schools.com/xhtml/default.asp
DetaljerOppgave 1 (Etter forelesning 31/8) Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oblig 1 Oppdatert: 10/09 Nye oppgaver Oppgave 1 (Etter forelesning 31/8) Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Oppgave 2 (Etter
DetaljerLæringsmål og pensum. Hvordan virker webteknologi? (klient-tjener arkitektur) HTML - virkemåte. Nettleser: Firefox, Opera, Safari
1 2 Læringsmål og pensum TDT4105/4110 Informasjonsteknologi grunnkurs: Uke 35/36 HTML Førsteamanuensis Alf Inge Wang Læringsmål Lære å lage statiske hjemmesider Bilder Lenker Lister Tabeller Skjema for
DetaljerIntroduksjon til HyperText Markup Language
Introduksjon til HyperText Markup Language Skrevet av Atle Nes Avdeling for informatikk og e-læring Høgskolen i Sør-Trøndelag Dette er en kort introduksjon til hvordan du kan lage websider med en enkel
Detaljerthe web Introduksjon Lesson
Lesson 1 the web All Code Clubs must be registered. Registered clubs appear on the map at codeclub.org.uk - if your club is not on the map then visit jumpto.cc/18cplpy to find out what to do. Introduksjon
DetaljerEt forsøk på definisjon. Eksempel 1
[Kurssidene] [ ABI - fagsider bibin ] Introduksjon Michael Preminger (michael.preminger@hioa.no) 13/12-13 I denne forelesningen: Utvikling av dynamiske nettsteder med PHP og databaser, våren 2014 Motivasjon:
Detaljer(X)HTML, CSS og JavaScript HTML. Det første dokumentet 26.11.2007. Grunnleggende programmering i Java Monica Strand 26.
(X)HTML, CSS og JavaScript Grunnleggende programmering i Java Monica Strand 26. november 2007 Gr. leggende Java 26. november 2007 1 HTML HTML = Hyper Text Markup Language Strukturerer tekstinnhold HTML
DetaljerEt forsøk på definisjon
Et forsøk på definisjon [Kurssidene] [ ABI - fagsider bibin ] Michael Preminger (michaelp@hio.no) 21/08-16 Engelsklignende språk, med rigid syntaks, som kan brukes til å skrive instruksjoner (eksempel
DetaljerINF1040 Oppgavesett 5: XML
INF1040 Oppgavesett 5: XML (Kapittel 3) Husk: De viktigste oppgavetypene i oppgavesettet er Tenk selv - og Prøv selv - oppgavene. Fasitoppgaver Ingen fasitoppgaver denne gang. Se flervalgsoppgavene under.
DetaljerOblig 1. Oppgave 1. Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oblig 1 Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Problemer med arngren.net: 1. Nettsiden er SYKT uoversiktlig! 2. Det er
DetaljerOBLIG 1 - WEBUTVIKLING
OBLIG 1 WEBUTVIKLING Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Problemer med funksjonalitet / bruk Uoversiktlig side For
DetaljerStilark Cascading Style Sheets - CSS
Stilark Cascading Style Sheets - CSS /* Eksempel på stilark */ h1 { text-align: center; color: blue; } Læreboka kapittel 5 12. september 2007 INF1040-CSS-1 Boks-modellen Et XHTML-dokument er satt sammen
DetaljerStilark Cascading Style Sheets - CSS
Stilark Cascading Style Sheets - CSS /* Eksempel på stilark */ h1 { text-align: center; color: blue; } Læreboka kapittel 5 12. september 2007 Boks-modellen Et XHTML-dokument er satt sammen av elementer
DetaljerWeb fundamentals. Web design. Frontend vs. Backend 17.01.2008. Webdesign 17. januar 2008 3. Monica Strand
Web fundamentals Webdesign 17. januar 2008 Monica Strand Webdesign 17. januar 2008 1 Web design Fagområdet Web design inneholder flere disipliner Grafisk design Informasjonsdesign Brukergrensesnittdesign
DetaljerEKSAMEN Web-publisering
EKSAMEN 6101 Web-publisering 02.06.2016 Tid: Målform: Sidetall: 3 timer Bokmål 5 (inkludert denne) Hjelpemiddel: Ingen Merknader: Vedlegg: Alle oppgavene er vektet, pass på å fordele tiden du bruker mellom
DetaljerCASCADING STYLESHEETS (CSS)
CASCADING STYLESHEETS (CSS) HVA ER CSS Stylesheets er en metode for å flytte selve formatteringen av et HTML dokument ut av selve dokumentet og over i et eksternt regelsett. Dette skyldes HTMLs manglende
DetaljerLøsningsskisse prøve IT1
Løsningsskisse prøve IT1 Etikk og regler Forklar disse begrepene åndsverk litterært, vitenskapelig eller kunstnerisk visst minimum av original, skapende innsats verkshøyde for å ha opphavsrettslig vern
DetaljerHåkon Tolsby Håkon Tolsby
HTML5 og CSS Håkon Tolsby 27.08.2018 Håkon Tolsby 1 En webside min webside en html5 side dett er min første
DetaljerINF1040 Oppgavesett 2: Nettsider og XHTML
INF1040 Oppgavesett 2: Nettsider og XHTML (Kapittel 4) Fasitoppgaver Ingen fasitoppgaver denne gang. Se flervalgsoppgavene under. Flervalgsoppgaver I følgende oppgaver er det oppgitt fem alternativer der
DetaljerHUMIT1731. Tekstkoding. Koding/merking av tekst Uke 35. Tekster som teknologiske produkter. Koding/merking på flere nivå. Utvikling av notesystemet
HUMIT1731 Koding/merking av tekst Uke 35 Tekstkoding Representasjon av info, om visse aspekter ved tekster, så som Typografi Innhold Struktur Annet på en eksplisitt, systematisk og formalisert måte HUMIT1731
DetaljerRammer. Mer om Javascript
Rammer. Mer om Javascript LO130A Kirsten Ribu 11.10.2004 Kirsten Ribu - HiO - LO 130 A 1 I dag Om rammer (Frames) Mer om Javascript Kirsten Ribu - HiO - LO 130 A 2 Innledende om rammer (Frames) Med rammer
DetaljerKursdokumentasjon for Dreamweaver
Kursdokumentasjon for Dreamweaver Skrevet av 2/13 1 Komme i gang med Dreamweaver... 3 2 Bruk av Dreamweaver... 4 2.1 Verktøylinja...5 2.2 Properties... 5 3 Sidens egenskaper... 6 4 Tekst... 7 4.1 Endre
DetaljerEKSAMEN Webpublisering
Høgskolen i Telemark Fakultet for allmennvitenskapelige fag EKSAMEN 6101 Webpublisering 03.12.2015 Tid: Målform: Sidetal: 3 timer Bokmål 5 (inkludert denne) Hjelpemiddel: Ingen Merknader: Alle oppgavene
DetaljerUtvikling av dynamiske nettsteder med PHP og databaser, høsten 2006
Page 1 Page 2 Utvikling av dynamiske nettsteder med PHP og databaser, høsten 2006 Introduksjon Michael Preminger (michaelp@hio.no) 23/08-06 I denne forelesningen: Motivasjon: Hvorfor vi lærer å programmere
DetaljerNCE TOURISM FJORD NORWAY. FJORDNETT INTERNETTFORUM 2012 Bergen, 12./13. juni 2012
NCE TOURISM FJORD NORWAY FJORDNETT INTERNETTFORUM 2012 Bergen, 12./13. juni 2012 HACKERS HOUR Hvor langt kommer vi med FjordNett rammeverket? Html CSS Javascript Hva er bestanddelene av en nettside? Html
DetaljerLO130A Webpublisering. Forelesning 1 23.08.04
LO130A Webpublisering Forelesning 1 23.08.04 1 I dag Leksjon 1: Internett, webservere og nettlesere. Leksjon 2: Innledende om (X)HTML. 2 Kort om historien til INTERNETT ARPA-net (Advanced Research Project
DetaljerHTML: Del inn nettsiden
HTML: Del inn nettsiden Erfaren Web Introduksjon Målet med denne oppgaven er å lære hvordan man kan organisere en nettside ved å dele den inn med forskjellige tagger. Dersom du ikke er kjent med tagg-strukturen
DetaljerSteg 1: Vi starter fra toppen
CSS: Layout Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Målet med oppgaven er å lære hvordan
DetaljerDenne rapporten er beregnet for dataansvarlig på Grefsenhjemmet, den som skal installere, vedlikeholde og modifisere systemet.
Produktrapport Forord Denne rapporten er beregnet for dataansvarlig på Grefsenhjemmet, den som skal installere, vedlikeholde og modifisere systemet. Dataansvarlig eller supporter trenger informasjon om
DetaljerCSS-formatering: stilark med kommentarer
CSS-formatering: stilark med kommentarer /* Demonstrasjon av stilarkregler. Jeg har satt inn forslag til farger og fonter, men du setter inn dine egne valg selvfølgelig. */ /* Stilregler for html-taggen
DetaljerI denne oppgaven forventer vi at du har vært gjennom HTML- og CSS-oppgavene så langt og/eller er kjent med <div> - og HTML5-taggene.
CSS: Layout Ekspert Web Introduksjon Målet med oppgaven er å lære hvordan man lager en nettside med en meny og et innholdsfelt. I denne oppgaven forventer vi at du har vært gjennom HTML- og CSS-oppgavene
DetaljerDigitale dokumenter 1
Digitale dokumenter 1 Struktur: HTML5 Tine Lodberg Frost Digitale dokumenter 11.11.2013 Delvis basert på forelesningsnotater av Tor Arne Dahl Dagens forelesning Introduksjon Praktisk informasjon Bakgrunn
DetaljerHTML-del. 1. <!-- ikke slett min kode, vær så snill --> er a) en HTML stil-tag b) en CSS stil-tag c) en HTML kommentar-tag d) en CSS kommentar-tag
HTML-del 1. er a) en HTML stil-tag b) en CSS stil-tag c) en HTML kommentar-tag d) en CSS kommentar-tag 2. Grafisk elementer på web skal være a) 72 ppi b) 144
DetaljerSteg 1: Felix har forsvunnet!
HTML: Forsvunnet katt Skrevet av: Arve Seljebu Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi, Norsk Klassetrinn: 5.-7. klasse, 8.-10. klasse, Videregående skole Introduksjon Katten
DetaljerForsvunnet katt webside
Lesson 3 Forsvunnet katt webside All Code Clubs must be registered. Registered clubs appear on the map at codeclubworld.org - if your club is not on the map then visit jumpto.cc/18cplpy to find out what
Detaljer<HTML Koder> Enkle HTML koder for bruk til bl.a cachebeskrivelser. Ver. 2.01
Enkle HTML koder for bruk til bl.a cachebeskrivelser. Ver. 2.01 Side 2 Ett HTML dokument inneholder både tekst som skal vises og instruksjoner om hvordan den skal vises av nettleseren. Instruksjonene
DetaljerEKSAMEN / 6101N WebPublisering
EKSAMEN 6101 / 6101N WebPublisering 09.12.2016 Tid: Målform: Antall sider: 3 timer Bokmål 8 (inkludert denne) Hjelpemidler: Ingen Merknader: Vedlegg: Alle oppgavene er vektet, pass på å fordele tiden du
DetaljerForelesning 23/9-08 Webprog 1. Tom Heine Nätt
Forelesning 23/9-08 Webprog 1 Tom Heine Nätt Kursinfo Tom Heine Nätt E-post: tom.h.natt@hiof.no Mobil: 92012120 MSN: thnatt@hotmail.com All nødvendig info (forhåpentligvis) finnes på kursets webside: http://www.it.hiof.no/webprog1
DetaljerINF1040 Oppgavesett 4: CSS
INF1040 Oppgavesett 4: CSS (Kapittel 5) Fasitoppgaver Ingen fasitoppgaver denne gang. Se flervalgsoppgavene under. Flervalgsoppgaver I følgende oppgaver er det oppgitt fem alternativer der nøyaktig ett
DetaljerOppgavesamling til Webutvikling < >
TOM HEINE NÄTT EVA M. HORNNES JOSTEIN NORDENGEN Oppgavesamling til Webutvikling Oppdatert 08.09.2016 < > 2 Kapittel 1 Introduksjon til webutvikling 1.1 Hva husker du? Teori: Gå sammen to og to og besvar
DetaljerHTML / XHTML / CSS. Webpublisering for nybegynnere
Webpublisering for nybegynnere HTML / XHTML / CSS ICONS Management Elisabeth Buntz, Ths. Heftyesgt. 45, 0267 Oslo Tlf: 22551071 mobil: 90179215 ebuntz@icons.no http://www.icons.no HTML / XHTML... 3 Hvorfor
DetaljerMarkeringsspråk og XML
Markeringsspråk og XML Det var en gang og snipp, snapp, snute, så var det eventyret ute. Rå tekst vs. formatert tekst Standarder som ASCII,
DetaljerXML og JDOM. Helge Furuseth
XML og JDOM Helge Furuseth furuseth@idi.ntnu.no XML XML = Extensible Markup Language Basert på SGML Standard Generalized Markup Language HTML = Hypertext Markup Language Også basert på SGML Mange likheter
DetaljerMarkeringsspråk og XML
Markeringsspråk og XML Det var en gang og snipp, snapp, snute, så var det eventyret ute. Læreboka kapittel 3 INF1040-XML-1 Rå tekst vs.
DetaljerMarkeringsspråk og XML
Rå tekst vs. formatert tekst Markeringsspråk og XML Det var en gang og snipp, snapp, snute, så var det eventyret ute. Standarder som ASCII, ISO 8859-x og Unicode gjelder rå tekst (
Detaljer1.2 Dynamiske, tjenerbaserte og interaktive nettsteder
Kapittel 1 Innledning og motivasjon 1.1 Innledning Mye av dagens virksomhet på WWW, alt fra nettbanker til bibliotekkataloger, er dynamisk, interaktiv og databasestyrt. Alle som leser denne boken har brukt
DetaljerWebutvikling oblig 1 Marius Hanssen
Webutvikling oblig 1 Marius Hanssen Oppgave 1 arngren.net er en rotete nettside, enkelt sett forpestet med et uorganisert layout og en kode så grov at jeg ikke skjønner hvordan de klarte å finne en så
DetaljerAdministrering av SafariSøk
Administrering av SafariSøk Administrering av SafariSøk Revisjonshistorie Revisjon $Revision: 1.6 $ $Date: 2003/08/05 12:44:02 $ Innholdsfortegnelse 1. Om programmet... 1 Generelt... 1 2. Fremgangsmåter...
DetaljerI denne oppgaven skal du lære hvordan du kan flytte rundt på elementer og gjemme elementene bak andre elementer ved hjelp av CSS.
CSS: Skjul ninjaene Skrevet av: Oversatt fra Code Club UK (//codeclub.org.uk) Oversatt av: Trude Martinsen Kurs: Web Tema: Tekstbasert, Nettside Fag: Matematikk, Programmering, Teknologi, Kunst og håndverk
DetaljerEt forsøk på definisjon. Eksempel 1
Et forsøk på definisjon [Kurssidene] [ ABI - fagsider bibin ] Michael Preminger (michael.preminger@hioa.no) 19/08-15 Engelsklignende språk, med rigid syntaks, som kan brukes til å skrive instruksjoner
DetaljerCSS: Style nettsider. Introduksjon. Skrevet av: Arve Seljebu
CSS: Style nettsider Skrevet av: Arve Seljebu Kurs: Web Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon Nå skal vi lære å endre på
Detaljer#topp {} #header {} #navigation {} #leftcolum {} #rightcolumn {} #footer {}
CSS Definisjon CSS- Cascading Style Sheets er et språk som brukes til å definere utseende på filer skrevet i HTML eller XML. Prinsippet er at HTML- eller XML-dokumentet utelukkende skal beskrive struktur
DetaljerOppgave 1: Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oppgave 1: Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Svar: Ved første øyekast har utvikleren av nestesiden plasser altfor mange div
DetaljerHåkon Tolsby. 25.08.2014 Håkon Tolsby
HTML5 og CSS Håkon Tolsby 25.08.2014 Håkon Tolsby 1 En webside min webside en html5 side dett er min første
DetaljerEn enkel while-løkke. 1 of 12 15.09.2015 15:28. 2 of 12 15.09.2015 15:28. while-løkker gjentar instruksjonene så lenge en betingelse er oppfylt
while-løkker gjentar instruksjonene så lenge en betingelse er oppfylt [Kurssidene] [ ABI - fagsider bibin ] Michael Preminger (michaelp@hioa.no) 15/09-15 En liten repetisjon Løkker Arrayer (tabeller) Løkker
DetaljerHØGSKOLEN I SØR-TRØNDELAG
HØGSKOLEN I SØR-TRØNDELAG Avdeling for informatikk og e-læring Kandidat nr: Eksamensdato: 13. mai 2005 Varighet: 3 timer (9:00 12:00) Fagnummer: LO515D Fagnavn: Klasser: NETT2005V Studiepoeng: 6 Faglærer:
Detaljerdatatyper Hva er programmering? Variabler og Informasjonsteknologi 2 Kompetansesemål
Variabler og datatyper Gløer Olav Langslet Sandvika VGS Høst 2012 Informasjonsteknologi 2 Hva er programmering? Når du skal bake en kake følger du gjerne en oppskrift. Først er det beskrevet hva kaken
DetaljerUtvikling av dynamiske nettsteder med PHP og databaser, høsten 2006
Page 1 Page 2 [Kurssidene] [ JBI] [ ] Utvikling av dynamiske nettsteder med PHP og databaser, høsten 2006 Vi kommer for det meste til å bruke while-løkker, men for-løkker anses viktige å kjenne til Michael
DetaljerHØGSKOLEN I SØR-TRØNDELAG
HØGSKOLEN I SØR-TRØNDELAG Avdeling for informatikk og e-læring Kandidat nr: DELVIS LØSNINGSFORSLAG (ikke fullstendig) Eksamensdato: 12. desember 2005 Varighet: 3 timer (9:00 12:00) Fagnummer: LO515D Fagnavn:
DetaljerCSS: Style nettsider Nybegynner
CSS: Style nettsider Nybegynner Web Introduksjon Nå skal vi lære å endre på stilen til nettsider. I denne oppgaven forventer vi at du har gjort HTML-oppgavene eller er litt kjent med HTML fra før av. I
DetaljerLæringsmål og pensum. Skript og markupspråk. Hva er HTML?
1 2 Læringsmål og pensum TDT4105 Informasjonsteknologi grunnkurs: Uke 46 Markup og skriptingspråk Alf Inge Wang Asbjørn Thomassen Mål Viktige begreper, forkortelser og prinsipper for markup og skriptingspråk
DetaljerDesktop. Grunnleggende bruk av EndNote. Viktig startinfo 3 punkt s. 1. Skrive inn referanser manuelt s. 3
Grunnleggende bruk av EndNote Desktop Viktig startinfo 3 punkt s. 1 Skrive inn referanser manuelt s. 3 Overføre referanser fra databaser/søkemotorer s. 4 Dublettkontroll s. 5 Samspill mellom EndNote og
DetaljerOBLIG 1 WEBUTVIKLING. Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
OBLIG 1 WEBUTVIKLING Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Tar lang tid å laste inn siden: Mye bilder Mange animasjoner
DetaljerSUKKERGRIS. Anita og Silje DAT100
SUKKERGRIS Anita og Silje DAT100 I NNHOLD 1. Innledning... 2 2. Beskrivelse av Sukkergris... 3 2.1 Struktur og grafisk design... 3 2.1.1 Sidens oppbygning... 3 2.1.2 CSS og Grafisk design... 4 2.2 Oversikt
DetaljerXSLT 2. David Massey MBIB
XSLT 2 David Massey MBIB4140 21-9-2017 Demo html.xsl mondial.xsl albania 1214489 1618829
DetaljerOblig 1 Webutvikling av Jon-Håkon Rabben
Oblig 1 Webutvikling av Jon-Håkon Rabben Oppgave 2 og 3) http://www.it-stud.hiof.no/~jhrabben/boxmodel.html Oppgave 6) http://www.it-stud.hiof.no/~jhrabben/oblig1oppg6.html Oppgave 1) Siden tar lang tid
DetaljerJavascript. Mer om layout
Javascript. Mer om layout Kirsten Ribu 04.10.04 Kirsten Ribu - Webpublisering - HiO -2004 1 Men først. Hvordan går det med klasser og blokker? Hjalp det med mailene? Litt mer om klasser og blokker ;-)
DetaljerOblig 1 Erlend Hannestad
Oblig 1 Erlend Hannestad Oppgave 1 Nettsiden er ustrukturert og uryddig når det kommer til layout og design, det er vanskelig å holde oversikt over alt som vises på siden, det er rett og slett for mye
DetaljerCSS: Animasjon Nybegynner
CSS: Animasjon Nybegynner Web Introduksjon I denne oppgaven skal du lære å animerer HTML-objekter ved hjelp av CSS. Under ser du hvordan resultatet vil bli til slutt: Men før vi starter å lage animasjonen
DetaljerEndNote referansehåndteringsprogram. HiVe biblioteket
EndNote referansehåndteringsprogram HiVe biblioteket Mappestruktur Mine dokumenter EndNote Bibliotek.enl Bibliotek.Data Styles APA 6th HiVe.ens 2 Om EndNote EndNote brukes til å holde orden på litteraturreferanser.
DetaljerHØGSKOLEN I SØR-TRØNDELAG
HØGSKOLEN I SØR-TRØNDELAG Avdeling for informatikk og e-læring - AITeL Kandidatnr: Eksamensdato: 18. mai 2006 Varighet: 3 timer (09:00 12:00) Fagnummer: Fagnavn: Klasse(r): LV197D Webprogrammering med
DetaljerHVA ER XML? extensible Markup Language En standardisert måte å strukturere ulike typer data Åpent format Enkelt:
HVA ER XML? extensible Markup Language En standardisert måte å strukturere ulike typer data Åpent format Enkelt: Tagger/Noder Attributter Mest kjente XML-versjon er XHTML En mengde datakilder er tilgjengelige
DetaljerManual for innlegging av standard sideinnhold og nyheter via «backend»
Manual for innlegging av standard sideinnhold og nyheter via «backend» 23.3.2006 Utarbeidet av: 2 Innlogging og beskrivelse av hovedelement i «backend» For å få tilgang til redigeringsmodul velges følgende
DetaljerKortversjon - Akseptansetest av sending Elektronisk epikrise - Den gode epikrise
Kortversjon - Akseptansetest av sending Elektronisk epikrise - Den gode epikrise Meldingsversjon: 1.1 datert 23.09.2006 Akseptansetest av sending Epikrise 2 Informasjon om avsendersystem Programvareleverandør:
DetaljerKapittel 1. Innledning og motivasjon. 1.1 Innledning. 1.2 Dynamiske, tjenerbaserte og interaktive nettsteder. 1.2.1 Dynamiske nettsider
1.2. Dynamiske, tjenerbaserte og interaktive nettsteer Kapittel 1 Innlening og motivasjon 1.1 Innlening Mye av agens virksomhet på WWW, alt fra nettbanker til bibliotekkataloger, er ynamisk, interaktiv
Detaljer1. Cascading Style Sheet (CSS)
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Lene Hoff 18.7.2007 Lærestoffet er utviklet for faget LN515D XML Teknologi 1. Resymé: I denne leksjonen skal vi ta for oss CSS (Cascading
Detaljerdesktop Grunnleggende bruk av EndNote Viktig info 3 punkt s. 2 Skrive inn referanser manuelt s. 4 Overføre referanser fra databaser/søkemotorer s.
Grunnleggende bruk av EndNote desktop Viktig info 3 punkt s. 2 Skrive inn referanser manuelt s. 4 Overføre referanser fra databaser/søkemotorer s. 5 Dublettkontroll s. 9 Samspill mellom EndNote X9 og Word
DetaljerDette er en demonstrasjonsside som vi skal bruke for å se litt nærmere på HTTP protokollen. Eksemplet vil også illustrere et par ting i PHP.
1 Dette er en demonstrasjonsside som vi skal bruke for å se litt nærmere på HTTP protokollen. Eksemplet vil også illustrere et par ting i PHP. (Læreboka kapittel 2-5) Legg merke til den første blokken,
DetaljerOppgave 1. Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.
Oppgave 1 Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak. Når man tar pilen over fanene, dukker det opp utrolig mange tagger. Dvs alt er
DetaljerINTRODUKSJON HVEM ER DETTE FAGET FOR?...
Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag Kom i gang med PHP Svend Andreas Horgen Lærestoffet er utviklet for faget IINI3003 Webprogrammering med PHP Resymé: Denne leksjonen skal
DetaljerEt forsøk på definisjon
Et forsøk på definisjon [Kurssidene] [ ABI - fagsider bibin ] Michael Preminger (michaelp@hio.no) 18/08-17 Engelsklignende språk, med rigid syntaks, som kan brukes til å skrive instruksjoner (eksempel
DetaljerSemistrukturerte data og XML
UNIVERSITETET I OSLO Semistrukturerte data og XML Where is the Life we have lost in living? Where is the wisdom we have lost in knowledge? Where is the knowledge we have lost in information? -- T. S. Eliot
DetaljerSteg 1: Animasjons-attributtet
CSS: Animasjon Skrevet av: Lars Klingenberg Kurs: Web Tema: Tekstbasert, Nettside, Animasjon Fag: Matematikk, Programmering, Kunst og håndverk Klassetrinn: 5.-7. klasse, 8.-10. klasse, Videregående skole
DetaljerAlle publiserte nyheter arkiveres i kategorier som du selv oppretter, Det gir deg en ryddig oversikt i arkivet senere.
PUBLISERING Som innlogget bruker får du tilgang til publiseringsfunksjoner... ABC for publisering Overskrift Ingress Ingressbilde Hovedtekst Widget Visning Verktøy Annet Alle publiserte nyheter arkiveres
Detaljerdesktop Grunnleggende bruk av EndNote Viktig info 3 punkt s. 2 Skrive inn referanser manuelt s. 4 Overføre referanser fra databaser/søkemotorer s.
Grunnleggende bruk av EndNote desktop Viktig info 3 punkt s. 2 Skrive inn referanser manuelt s. 4 Overføre referanser fra databaser/søkemotorer s. 5 Dublettkontroll s. 9 Samspill mellom EndNote X9 og Word
DetaljerHøringsnotat ny delversjon av Referansekatalog for anbefalte og obligatoriske IT-standarder i offentlig sektor, våren 2015
Høringsnotat ny delversjon av Referansekatalog for anbefalte og obligatoriske IT-standarder i offentlig sektor, våren 2015 1 Innhold 1. Bakgrunn og innledning... 3 2. Standarder for publisering av nettleserbaserte
DetaljerSide 1. Sniggabo CMS brukermanual rev. 2
Side 1 Sniggabo CMS brukermanual rev. 2 INNHOLDSFORTEGNELSE Logg inn... 3 Menylinje... 3 Artikkelliste... 4 Ny artikkel... 5 Aktiviteter... 8 Rediger aktivitet... 9 Dokumenter... 9 Nytt dokument... 10
DetaljerEndNote. Overføre referanser fra databaser/søkemotorer s. 5. Samspill mellom EndNote og Word 2016 s. 7
Grunnleggende bruk av EndNote desktop Viktig startinfo 3 punkt s. 2 Skrive inn referanser manuelt s. 4 Overføre referanser fra databaser/søkemotorer s. 5 Dublettkontroll s. 6 Samspill mellom EndNote og
DetaljerOppbygging av innhold på responsive nettsider.
Oppbygging av innhold på responsive nettsider. HTML og CSS er koder som forteller nettleseren hvordan strukturen og utseende på en nettside skal vises på skjermen din. Selv om du ikke ser kildekoden når
DetaljerBRUK AV TEKSTEDITOREN
Dynamisk Internett-publisering med DM Web BRUK AV TEKSTEDITOREN BRUKERVEILEDNING 2007 Datamann AS er Brukermanualen er utarbeidet av Datamann AS Postboks 74 9551 ØKSFJORD Telefon 78 45 95 00 Telefaks 78
Detaljer