Denne artikel er til dem der ønsker at vide mere om hvad CSS er og hvad CSS kan bruges til hvad angår WWW.

Save this PDF as:
 WORD  PNG  TXT  JPG

Størrelse: px
Starte visningen fra side:

Download "Denne artikel er til dem der ønsker at vide mere om hvad CSS er og hvad CSS kan bruges til hvad angår WWW."

Transkript

1 Denne guide er oprindeligt udgivet på Eksperten.dk CSS - en gennemgang Denne artikel er til dem der ønsker at vide mere om hvad CSS er og hvad CSS kan bruges til hvad angår WWW. Der er lidt CSS historie med samt små eksempler på de forskellige type af CSS. Artiklen henvender sig ikke til dig der allerede kender CSS. Skrevet den 04. Feb 2009 af foxmulder58 I kategorien Design / Generelt CSS - Cascading Style Sheets hvad kan de?, og måske endnu vigtigere hvad kan de gøre for din webside. Det forsøger jeg i denne artikel at forklre. HTML 4.0 og Cascading Style Sheets Det nok mest interessante ved HTML 4.0. er nok af det understøtter Cascading Style Sheets (CSS) fuldstændigt. I HTML 3.2 eksisterede der en masse "indbyggede" formaterende elementer og attributter som skulle formatere designet. Men disse elementer og attributter gjorde det svært for webside udviklere at udvikle og vedligeholde store websider med hundredvis af dokumenter. Med HTML 4.0. kom muligheden heldigvis at kunne anvende et Cascading Style Sheet, der således giver webside udvikleren muligheden for at rette i et sted i style Sheets hvilket så formaterer alle de sider der er berørt af denne. HTML 4.0 giver Cascading Style Sheets muligheden for at vise browseren hvorledes et dokument skal fremvises. Til dette anvender man de 2 attributter ID, CLASS og STYLE. 2 Versioner af Cascading Style Sheets Cascading stylesheets er kommet i to versioner, nemlig version 1 og version 2. Disse er oftest refereret til som CSS1 og CSS2. CSS1 giver muligheden for at vælge fonte, farver og understøttes i mere eller mindre grad af Internet Explorer 4 og opefter, Netscape 4 og opefter samt Opera browseren. CSS2 giver mulighed for at positionere forskellige elementer, at lave print sheets - dvs. et Style Sheet der kan anvendes til print. Envidere kan CSS2 lave layout på tabeller (<tables>. CSS2 understøttes udmærket af browseren IE 5 og opefter.

2 Cascading Stylesheet kan altså ændre udseendet på alle elementer der findes på din webside. Hvert enkelt element på din side kan altså formateres efter lige dine ønsker med hensyn til placering, farve, skrift type osv. Fordelen ved at anvende et Cascading Style Sheet Adskil indhold fra formatering Først og fremmest er fordelen at man kan skille formatering fra indholdet. Dette medvirker til at når man designer en webside har bedre kontrol, samt mere overskuelighed, eftersom tekstindhold og formatering ligger i hvert sit dokument. (medmindre man anvender et internt Cascading Style Sheet, men det kommer vi til.). Nemmere redigering Har du en webside der består af rigtig mange HTML-sider med hver deres specifikke indhold (skriftstørrelse, skrifttype, farver osv.), skal du hvis du ikke anvender Cascading Style Sheets åbne hver enkelt dokument i din WYSIWYG editor og redigere hver enkelt side. Hurtigere svartider på din side HTML er ikke designet til at fylde meget, men dine sider bliver jo tungere og tungere jo mere koder der kommer på den. Ved at anvende Cascading Style Sheets skal oplysningerne omkring formateringen kun hentes én enkelt gang, og nedsætter dermed overførselshastigheden på brugerens computer. Efter at have set lidt på hvad Cascading Style Sheet er det godt at komme med et par eksempler på hvordan Cascading Style Sheet kan anvendes. De 2 forskellige typer af stylesheets Der findes 2 type af Cascading Style Sheets, det eksterne stylesheet, og de interne Cascading Style Sheet. Lad os se på hvordan disse benyttes: Det eksterne Cascading Style Sheet Det eksterne style sheet er et helt separat dokument hvor der angives de formateringer som HTMLdokumenterne så henter og anvender. Et eksternt Cascading Style Sheet er et eksternt dokument, og har altid filnavnet.css. Den eksterne fil kan indeholde ganske få formateringer og lange liste med forskellige formateringer de såkaldte STYLES. Kort fortalt er der overhovedet ikke nogen begrænsninger for hvor mange eksterne Style Sheets et Htmldokument må linke til. For at linke til et eksternt Style Sheet og anvende de formateringsindstillinger det nu måtte indeholde er du nød ti at linke til dette. For at linke til et eksternt Style Sheet skal der placeres en kode i HTML-

3 dokumentets HEAD-kode. Dette link ser således ud: <link rel="stylesheet" type="text/css" href="mitstylesheet.css"> Man angiver således med denne kode stien ned til der hvor man har sin.css liggende. I ovenstående eksempel hedder min.css fil mitstylesheet.css. Koden href angiver således hvilken fil der er HTMLdokumentet skal formateres efter. I eksempelet lagde jeg min.css fil i rodmappen for websiden. Det er oftest en god idé at placere dine style sheets i en mappe du så eksempelvis kan kalde css. Antager vi nu at du har lavet mappen css og vil linke dertil skal du selvfølgelig angive det i stien dertil. Derfor kommer koden i stedet for den overstående nu til at se således ud: <link rel="stylesheet" type="text/css" href="css/mitstylesheet.css"> Bemærk nu at vi har angivet at style sheet nu er angivet til at være I mappen css. Her kan du så ser hvordan hele Html-dokumentet ser ud i sin helhed: <NB!>Bemærk at jeg ikke har sat nogen form for DOCTYPE på min HTML eksempler!, dette skal du dog ikke undlade når du koder dine HTML-dokumenter i al almindelighed[/b] HTML-dokument der anvender et eksternt cascading Style Sheet <html> <head> <link rel="stylesheet" type="text/css" href="css/mitstylesheet.css"> </head> <body> Her kommer alt det indhold der skal formateres </body> </html> [div]det interne Cascading Style Sheet Et internt Cascading Style Sheet er en række af formateringsoplysninger der gemmes inde i HTMLdokuments HEAD kode. Da dette Style Sheet er angivet i ét dokument gælder formateringsreglerne således kun for dette HTML-dokument. Lad os se hvordan et sådant internt Style Sheet ser ud. <html> <head> <style type="text/css"> <! - - body{ color:white;

4 background:blue; - -> </style> </head> <body> Sidens indhold </body> </html> I ovenstående eksempel kan du jo eventuelt prøve at copy/paste denne kode ind i din WYSIWYG-editor og se resultatet. Vi har ovenstående HTML-eksempel angivet at al tekst skal være skrevet med farven hvid via reglen color:white;</i> og at baggrundsfarven skal være blå via v.h.a reglen [i] background:blue; Den sidste form for Style Sheet jeg vil vise dig kaldes et inline style sheet. Inline style sheets adskiller sig fra de 2 øvrige det eksterne og det interne, stylesheets, ved at alle reglerne for formateringen ikke er samlet ét sted men derimod er dette placeret i selv koden. Eksempelvis: <p style="color:blue"> Den tekst der står her er blå</p> I ovenstående eksempelvis har vi via et inline Style Sheet angivet at tagget <p> skal vise alt indhold af tekst med farven blå. Når du anvender et inline Style Sheet vælger du specifikt den kode som du ønsker at formatere. Det illustrerede Style inline Style Sheet gælder altså ikke for eventuelle andre <p> tags. Her til sidst kunne jeg godt tænke mig at vise dig hvordan du kan anvende Cascading Style Sheet til at formatere en tom containerkode. Til eksemplet har jeg anvendt tagget DIV der er en tom container koder idet DIV ikke kan anvendes uden at dette har en eller anden form for formateringsregel (i form ad et Cascading Style Sheet) eller en attribut. I eksemplet anvender jeg 2 DIV tags til at formatere teksten udseende i form af farver, skrifttype og ikke mindst placering. I mit første eksempel ønsker jeg at teksten skal have en blå farve, have fonten Verdana og placeres til venstre i browser vindue. For at opnå dette anvender jeg en række regler der så skal formatere den tekst der er i DIV. Jeg laver min første regel som jeg kalder for afsnit1 CSS regel for afsnit 1 #afsnit1{ font-family:verdana; float:left color:blue;

5 <br/> Ved at indsætte tegnet "#" kan jeg angive at der er tale om et ID. ID`et er her altså afsnit 1 og alle de regler der er for #afsnit er altså : [div] font-family = Den font der skal anvendes, du kan selv angive flere fonte på én gang hvis du ønsker. float:left = Placerer DIV tagget ti venstre i browser vinduet color:blue = Angiver at al teksten i DIV tagget skal vises i farven blå. Jeg har lavet et mere, der næsten har de samme regler bortset fra at DIV her er placeret til højre og har en tekst farve i DIV der er rød. Du kan se koden for denne her: Regel for ID afsnit2 #afsnit2{ font-family:arial; float:right; color:red; <br/> [/div] Hele dokumentet med de 2 DIV formateringer kommer således til at se sådan ud i et internt style sheet. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"" <html> <head> <title>untitled</title> <style type="text/css"> <!-- #afsnit1{ font-family:verdana; float:left; color:blue; #afsnit2{ font-family:arial; float:right; color:red; --> </style>

6 </head> <body> <div id="afsnit1">her teksten for afsnit1 <div id="afsnit2">her teksten for afsnit2[/div] </body> </html> [/div] For mere information om Cascading Style Sheets kan du se nedenstående URL: For en reference til CSS1 og CSS2 se nedestående URL`er: Håber du har fået en bedre forståelse for hvad CSS er for en størrelse og hvad det kan gøre for dig. Mvh Mads Kommentar af fjappe d. 12. Aug Ok - artikel, men som milo, mener jeg også den er lidt overfladisk. Kommentar af milo d. 02. Aug En smule overladisk synes jeg, men ikke dårlig. dj-meisner: # er ikke "til en div". Du bør måske læse igen :) Kommentar af barbarbo d. 02. Aug Udemærket gennemgang for den der ønsker at starte med at bruge CSS. Giver en god lille indføring i

7 emnet og peger på mere information Kommentar af htmlkongen d. 23. Dec Udemærket artikel /Htmlkongen Kommentar af dj-meisner d. 31. Jul god. lærte at # var til en div, som jeg ikke vidste for 10 min, siden da jeg selv sad og legede. Kommentar af rtfm_now d. 01. Aug Fint, men du 1. glemmer CSS3 2. "CSS2 understøttes udmærket af browseren IE 5 og opefter." er 90% lodret løgn, IE understøtter hat af CSS2, og ca. intet af CSS3. 3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> er elendigt til CSS, da IE fucker op, og bruger sin egen standard for CSS (derved dør boxmodellen) hvis der ikke er angivet DTD link, find en flamewar med olebole, og i kan se rigtigt doctype. Kommentar af fasionoide d. 26. Oct Finder denne artikkel både ubrugelig og overfladisk Kommentar af just_p d. 01. Mar Helt ok, men overfladisk og gennemgangen på html.dk kan med fordel bruges som supplement for en nybegynder!

Om styles / typografier / typografiark / stylesheets

Om styles / typografier / typografiark / stylesheets Om styles / typografier / typografiark / stylesheets (dvs. Cascading StyleSheet ~ CSS) CSS er et sprog til at definere layout på HTML-dokumenter. CSS indeholder flere muligheder for layout end HTML og

Læs mere

Nu skal vi især se på <font> og <center> samt centrering af hele siden på skærmen.

Nu skal vi især se på <font> og <center> samt centrering af hele siden på skærmen. Validering 4 Nu skal vi især se på og samt centrering af hele siden på skærmen. Det er i HTML ikke forbudt at bruge koden , men lad nu være alligevel, du får blot en masse valideringsproblemer.

Læs mere

Lav dine egne hjemmesider/websider

Lav dine egne hjemmesider/websider Sider, der skal publiceres på World Wide Web, laves i et særligt format, html, som fortæller browseren, hvordan den skal vise tekst og billeder. Html (Hypertext markup language) er meget fleksibelt og

Læs mere

Sådan skriver du artikler til Eksperten!

Sådan skriver du artikler til Eksperten! Denne guide er oprindeligt udgivet på Eksperten.dk Sådan skriver du artikler til Eksperten! Når du skriver artikler handler det om at få den ud til de rigtige personer, og vise den frem så den er let forståelig.

Læs mere

Nolde Museet. I gang med Dreamweaver. Opgave. Opgavebeskrivelse. Layout. Mål og CSS

Nolde Museet. I gang med Dreamweaver. Opgave. Opgavebeskrivelse. Layout. Mål og CSS Opgavebeskrivelse Lav en webside om i Sønderjylland. Opgaven fører dig igennem de basale ting, hvad angår opbygningen af en side med CSS. Der er ikke tale om et komplet site, men du kan bruge opgaven som

Læs mere

Web sider. Introduktion: Har du nogensinde spekuleret over, hvordan det verdesomspændende internet virker og hvordan man snakker med det?

Web sider. Introduktion: Har du nogensinde spekuleret over, hvordan det verdesomspændende internet virker og hvordan man snakker med det? Introduktion: Har du nogensinde spekuleret over, hvordan det verdesomspændende internet virker og hvordan man snakker med det? I dag skal du lære at lave hjemmesider, så du også kan bidrage til at opbygge

Læs mere

Aptana editor til MAC og Windows

Aptana editor til MAC og Windows 1 Aptana editor til MAC og Windows http://aptana.com/products/studio3/download For at downloade Mac versionen skal du klikke på : Customize Your Download og der efter klikke på MAC OS X. Indtast navn og

Læs mere

I mit script tager jeg højde for det problem ved, at gemme et unikt tal mellem 0-9 på 6 cifre og derved vil de så blive vist som 2 online.

I mit script tager jeg højde for det problem ved, at gemme et unikt tal mellem 0-9 på 6 cifre og derved vil de så blive vist som 2 online. Denne guide er oprindeligt udgivet på Eksperten.dk Hvem er online? Online script, som tager højde for at der kan være flere personer, som har den samme IP-adresse. Scriptet viser hvor lang tid brugeren

Læs mere

Brugervejledning til Design Manager Version 1.02

Brugervejledning til Design Manager Version 1.02 Brugervejledning til Design Manager Version 1.02 Indholdsfortegnelse 1. Introduktion... 3 1.1 Det kan du med HostedShop Design Manager... 3 1.2 Feature list... 3 2. Design... 4 3. Filer og CSS... 4 3.1

Læs mere

PHP Quick Teknisk Ordbog

PHP Quick Teknisk Ordbog PHP Quick Teknisk Ordbog Af Daniel Pedersen PHP Quick Teknisk Ordbog 1 Indhold De mest brugte tekniske udtryk benyttet inden for web udvikling. Du vil kunne slå de enkelte ord op og læse om hvad de betyder,

Læs mere

Vejledning til opbygning af hjemmesider

Vejledning til opbygning af hjemmesider Side 1 af 9 Vejledning til opbygning af hjemmesider Hvis du er inde på din klubs hjemmeside, fx på forsiden, kan du nu gå i gang med at redigere. For at få redigeringsværktøjet frem, skal du klikke på

Læs mere

Beginning CSS and Web Development kap. 1 11

Beginning CSS and Web Development kap. 1 11 Beginning CSS and Web Development kap. 1 11 Plan Xhtml opbygning CSS Divs, class, id Baggrunde, farver og billeder Tekst Links Lister Tabeller Stand up programmering Xhtml vs. html i XHTML skal alle elementer

Læs mere

IKT og Videnrepræsentationer

IKT og Videnrepræsentationer IKT og Videnrepræsentationer CSTBI-2 2010 5. kursusgang Introduktion til html Kjeld Svidt ks@civil.aau.dk Personlige hjemmesider De enkelte gruppemedlemmer kan lave egne hjemmesider i mappen public_html

Læs mere

Dokumentation. Workflow. Grafisk produktion. Trine Alexandersen 1. hovedforløb

Dokumentation. Workflow. Grafisk produktion. Trine Alexandersen 1. hovedforløb Dokumentation Workflow Grafisk produktion Trine Alexandersen 1. hovedforløb Jeg har valgt at vise min egen hjemmeside som workflow. Siden er min e-portfolio som skal vise hvad jeg lærer under min uddannelse

Læs mere

Fase Forklaring Navigation. Mappen skal indeholde alle elementer til dit site.

Fase Forklaring Navigation. Mappen skal indeholde alle elementer til dit site. 1 Opstart af et site Opret hovedmappen Opret grafikmappen Opret dit site Mappen skal indeholde alle elementer til dit site. Opret en mappe indeni den første og kald den grafik. Heri lægges alle dine grafikfiler.

Læs mere

Projekt i Programmering C Menu til hjemmeside.

Projekt i Programmering C Menu til hjemmeside. Projekt i Programmering C Menu til hjemmeside. 10-12-2004 Holstebro HTX Bent Arnoldsen Synopsis. Projektet her er en menu til hjemmesider, som er lavet så den er let at tilrette, når man tilføjer eller

Læs mere

Dokumentation. Karen-Louise Fejerskov

Dokumentation. Karen-Louise Fejerskov Dokumentation Grafisk Workflow Et af produkterne, jeg skulle lave, var et redesign af FreQuence s info hjemmeside. A B Punkt 1 Ansvar: Jeg har selv stået for opsætningen af hjemmeside og selv bestemt,

Læs mere

MANUAL - Joomla! Version 1

MANUAL - Joomla! Version 1 MANUAL - Joomla! Version 1 Indhold Retningslinjer for hjemmesiden... 3 Log ind... 3 Ret i en artikel, der allerede er oprettet... 4 Opret ny artikel... 8 a) Skriv direkte i tekstfelt... 9 b) Indsæt tekst

Læs mere

Manual for Synkron hjemmesider

Manual for Synkron hjemmesider Manual for Synkron hjemmesider Denne manual tilhører: Brugernavn: (username) Adgangskode: (password) 1 Start med sitetræet: Sitetræet er centralt. Det er her, dit website er. Det er her, du bygger dine

Læs mere

Mini Afsluttende Projekt

Mini Afsluttende Projekt Mini Afsluttende Projekt Tobias Sønderskov Hansen og Lau Lund Leadbetter Roskilde Tekniske Gymnasium Klasse 2.4 - IT 2013 Side 1 af 18 Indholdsfortegnelse Indledning... 3 Mindmap... 3 User Stories... 4

Læs mere

Internet vs WWW. Internettet er IKKE det samme som www. Internettet Er et netværk af computere Gør det muligt af dele information

Internet vs WWW. Internettet er IKKE det samme som www. Internettet Er et netværk af computere Gør det muligt af dele information web som medie Internet vs WWW Internettet er IKKE det samme som www. Internettet Er et netværk af computere Gør det muligt af dele information Internet protokoller (forskellige måder at udveksle information

Læs mere

CSS introduktion: Tekstformatering med CSS

CSS introduktion: Tekstformatering med CSS Webdesign og webkommunikation, formiddagshold (hold 1), IT Universitetet, forår 2012. Øvelse 3, individuel øvelse CSS introduktion: Tekstformatering med CSS 1. Lidt om hvad du har lært Du har i øvelse

Læs mere

Lyngby Svømmeklub Hjemmeside Guide. Indholdsfortegnelse

Lyngby Svømmeklub Hjemmeside Guide. Indholdsfortegnelse Indholdsfortegnelse Indledning... 2 Hjemmeside struktur... 3 Rettigheder... 4 Opret Nyhed... 6 Opret Kalender Event... 7 Opret Arrangement... 9 Fast side... 10 Forside... 11 Tekst... 11 Billeder... 11

Læs mere

MANUAL - Joomla! Version 1

MANUAL - Joomla! Version 1 MANUAL - Joomla! Version 1 Indhold Retningslinjer for hjemmesiden... 2 Log ind... 2 Ret i en artikel, der allerede er oprettet... 3 Opret ny artikel... 6 a) Skriv direkte i tekstfelt... 7 b) Indsæt tekst

Læs mere

Kort om baggrund for kurset, aktører, kodning.dk

Kort om baggrund for kurset, aktører, kodning.dk præsentation 1 2 Kort om baggrund for kurset, aktører, kodning.dk 3 Kort rammesætning hvorfor er det vigtigt med fokus på programmering også i en skolekontekst særligt slide 7 er værd at dykke ned i og

Læs mere

GRAFISK WORKFLOW REDESIGN AF HJEMMESIDE

GRAFISK WORKFLOW REDESIGN AF HJEMMESIDE GRAFISK WORKFLOW REDESIGN AF HJEMMESIDE 2 REDESIGN AF FUTURECOM BUSINESS SOLUTIONS HJEMMESIDE OPGAVEN Den gamle hjemmeside skulles redesignes da den daværende hjemmeside var forældet (indhold og udseende)

Læs mere

Grundlæggende HTML. Hjemmesider, kommunikation og kode. mandag den 13. august 12

Grundlæggende HTML. Hjemmesider, kommunikation og kode. mandag den 13. august 12 Grundlæggende HTML Hjemmesider, kommunikation og kode Hvad er HTML? Hyper Text Markup Language Beskrivelsen siger at det er et tekst sprog bestående af markører Bruges til at vise hjemmesider i en browser,

Læs mere

! }! FORSIDE! <html>! <head>!

! }! FORSIDE! <html>! <head>! FORSIDE opgaver body { background-color:#33adff; } header { background:#33adff; color:white; text-align:center; padding:5px;

Læs mere

jquery - selectors, attributes, traversing og manipulation

jquery - selectors, attributes, traversing og manipulation Denne guide er oprindeligt udgivet på Eksperten.dk jquery - selectors, attributes, traversing og manipulation Jeg vil med denne første artikel fra mig om jquery komme kort ind på jquerys vidunderlige verden.

Læs mere

Sådan indlægges nyheder på DSqF s hjemmeside trin for trin

Sådan indlægges nyheder på DSqF s hjemmeside trin for trin Sådan indlægges nyheder på DSqF s hjemmeside trin for trin Systemkrav For at kunne bruge Composite kræves: Windows 95 eller nyere (bemærk - kun Windows kan bruges) Browseren Internet Explorer 6.0 eller

Læs mere

Hvad er Objekter - Programmering

Hvad er Objekter - Programmering Denne guide er oprindeligt udgivet på Eksperten.dk Hvad er Objekter - Programmering En rigtig god gennemgang af hvad objekter er! Hvordan de oprettes og anvendes! Det er helt klart til nybegyndere, som

Læs mere

Afsending af s vha. ASP

Afsending af  s vha. ASP Denne guide er oprindeligt udgivet på Eksperten.dk Afsending af emails vha. ASP Det kan ofte være praktisk at afsende emails fra sin hjemmeside. Denne artikel tager udgangspunkt i komponenten JMail fra

Læs mere

Nvu hjemmesider hurtigt og let

Nvu hjemmesider hurtigt og let Nvu hjemmesider hurtigt og let Brugervenlig og grafisk præsentation af textdokumenter var en af de store udfordringer indenfor softwareudvikling i slutningen af 1980erne. Tim Berners-Lee fra CERN udvikler

Læs mere

Formatering af tekst, JCE Editor, Joomla

Formatering af tekst, JCE Editor, Joomla Formatering af tekst, JCE Editor, Joomla skrevet af Inge Vittrup Paragraph anvender du ved almindelige sætninger. Heading 1 er hovedoverskrift med største skrift. Heading 2 er overskrift til en artikel

Læs mere

Lav din egen forside i webtrees

Lav din egen forside i webtrees Lav din egen forside i webtrees Du behøver ikke at kunne kode eller gøre noget advanceret for at designe din helt egen forside i webtrees. Alt du skal gøre er bare at gøre brug af den indbygget editor.

Læs mere

Bootstrap Tutorial LAV EN SIMPEL RESPONSIVE SIDE MED BOOTSTRAP MATHIAS HERSKIND GROTRIAN

Bootstrap Tutorial LAV EN SIMPEL RESPONSIVE SIDE MED BOOTSTRAP MATHIAS HERSKIND GROTRIAN 2015 Bootstrap Tutorial LAV EN SIMPEL RESPONSIVE SIDE MED BOOTSTRAP MATHIAS HERSKIND GROTRIAN I denne tutorial kommer du til at I denne tutorial vil du lære hvad Bootstrap er, hvordan det fungerer og hvordan

Læs mere

Introduktion til redigeringsfaciliteterne

Introduktion til redigeringsfaciliteterne Sitecore Foundry 3.0 Introduktion til redigeringsfaciliteterne 25. april 2012 - Version 1.2 Pentia A/S Store Kongensgade 66, Baghuset 1264 København K Telefon: 7023 3330 E-mail: info@foreningssite.dk Indholdsfortegnelse

Læs mere

CSS fortsat: Boksmodel, floating & positionering

CSS fortsat: Boksmodel, floating & positionering Webdesign og webkommunikation, formiddagshold (hold 1), IT Universitetet, forår 2012. Øvelse 4, individuel øvelse CSS fortsat: Boksmodel, floating & positionering 1. Lidt om hvad du har lært Du har i øvelse

Læs mere

Annemette Søgaard Hansen/www.dinwebvejleder.dk

Annemette Søgaard Hansen/www.dinwebvejleder.dk Google Docs Regneark Indholdsfortegnelse Værktøjer... Side 3 Menuer... Side 6 Opgave... Side 13 Få adgang til filerne fra din computer... Side 19 Vejledende løsning... Side 20 GoogleDocs Regneark 2 Google

Læs mere

TinyMCE Bruger Guide. Forord. Contents

TinyMCE Bruger Guide. Forord. Contents TinyMCE Bruger Guide Forord TinyMCE er en platformuafhængig web baseret Javascript HTML WYSIWYG (What You See Is What You Get) editor udgivet som Open Source under LGPL af Moxiecode Systems AB. Dette er

Læs mere

Lad os lave en hjemmeside. Kikker du på http://www.olehasselbalch.dk, vil du højst sandsynligt se dette.

Lad os lave en hjemmeside. Kikker du på http://www.olehasselbalch.dk, vil du højst sandsynligt se dette. Lad os lave en hjemmeside. Kikker du på http://www.olehasselbalch.dk, vil du højst sandsynligt se dette. Spørgsmålet er nu, hvordan laver man sådan en side? Du skal have et såkaldt webhotel, hvilket jeg

Læs mere

Dokumenter. Sider. efact CMS manual v. 1.0

Dokumenter. Sider. efact CMS manual v. 1.0 Dokumenter Dokumenter er stedet, hvor du opretter og vedligeholder dit indhold på hjemmesiden. Der kan uploades filer og billeder til brug på hjemmesiden, samt oprettes sider hvis indhold du redigerer

Læs mere

Byg web sider. Introduktion:

Byg web sider. Introduktion: Introduktion: Du kender nu nogle enkle HTML tags, så nu er det på tide, at du kommer i gang med at lave din første side! Når du har nogle HTML-sider klar skal du have dem lagt op, så dine venner kan se

Læs mere

Med register_globals = On får du automatisk adgang til en række variabelnavne i dit script.

Med register_globals = On får du automatisk adgang til en række variabelnavne i dit script. Denne guide er oprindeligt udgivet på Eksperten.dk Register Globals Off Lad os slå en ting fast med det samme - register_globals = Off er en god ting, i hvert fald set ud fra et sikkerhedsmæssigt synspunkt.

Læs mere

LOGIN CONTENT STATION

LOGIN CONTENT STATION WOOWING QUIKGUI 1 LOGIN ONTNT STTION 1. Start ontent Station (enten som separat program eller direkte i din browser på publish.datagraf.dk ). Her kommer du til Login. 2. (Valgfrit) Klik Options og vælg

Læs mere

Redaktørmanual TYPO3 Version 6.2

Redaktørmanual TYPO3 Version 6.2 Redaktørmanual TYPO3 Version 6.2 www.t3cms.dk TYPO3 Manual Version 6.2 Side 1 af 20 T3CMS Tlf: 70 25 00 22 Indholdsfortegnelse Generel info om TYPO3 3 Rediger din side 4-6 Indsættelse af links 7 Indsæt

Læs mere

HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside Tekstformatering med CSS

HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside Tekstformatering med CSS Øvelse 2, individuel øvelse HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside Tekstformatering med CSS 1. Lidt om hvad du har lært Du har i øvelse 1 lært at lave en HTML5-side med afsnit,

Læs mere

Grafisk design. Ide. Designprocess. Målgruppe

Grafisk design. Ide. Designprocess. Målgruppe Ide Designprocess I denne opgave har jeg udviklet et website for et feriehus. Kunden ønsker et site, som både fungere privat, men også som offentlig hjemmeside. Hele site skal være på dansk, tysk og engelsk.

Læs mere

Eksempel på transformation: XML -> RTF dokument:

Eksempel på transformation: XML -> RTF dokument: Eksempel på transformation: XML -> RTF dokument: RTF dokumenter er Rich Text dokumenter der kan formateres med farver og forskellige skrifttyper. I nogle tilfælde kan det være interessant at transformere

Læs mere

Namespaces. Vi kan kvalificere elementer på denne måde: <?xml version="1.0" encoding="iso-8859-1"?>

Namespaces. Vi kan kvalificere elementer på denne måde: <?xml version=1.0 encoding=iso-8859-1?> Namespaces...1 Default namespace:...6 Præfiks:...7 To slags navne i XML:...11 Standard namespaces:...14 RDF Resource Description Framework:...18 Attributter:...19 DTD skemaer og namespaces:...21 Namespaces.

Læs mere

Webteknologi evalueringsopgave Vinter 2011-2012 - Niels Sundstrup

Webteknologi evalueringsopgave Vinter 2011-2012 - Niels Sundstrup Niels Sundstrup Webteknologi evalueringsopgave Vinter 2011-2012 - Niels Sundstrup Webteknologi - Carl- Henrik Nielsen - Syddansk Universitet, Kolding - Udlevering: 12. januar 2012 Aflevering: 19. januar

Læs mere

Velkommen til denne korte vejledning i hvordan du kan oprette dine egne sider på foreningens hjemmeside.

Velkommen til denne korte vejledning i hvordan du kan oprette dine egne sider på foreningens hjemmeside. Side 1 Velkommen til denne korte vejledning i hvordan du kan oprette dine egne sider på foreningens hjemmeside. Login til mine websider Du starter med at logge ind som medlem. Herefter klikker du på den

Læs mere

Grundformen for et website: aside, tabeller, formularer og tekstformatering

Grundformen for et website: aside, tabeller, formularer og tekstformatering Design til digitale kommunikationsplatforme Formiddag (Hold 1), IT Universitetet, Efterår 2013 Øvelse 2, individuel øvelse Grundformen for et website: aside, tabeller, formularer og tekstformatering 1.

Læs mere

Opstart. I gang med Dreamweaver. Læs mere om...

Opstart. I gang med Dreamweaver. Læs mere om... Generelle bemærkninger Programmet Dreamweaver har været på markedet i nogle år efterhånden. Den seneste version hedder Dreamweaver CS6, og programmet er på engelsk. Dreamweaver er en såkaldt grafisk editor,

Læs mere

Encoding:...1 Et tegn sæt (character set):...1 UTF-8 og UTF-16 (Unicode):...2

Encoding:...1 Et tegn sæt (character set):...1 UTF-8 og UTF-16 (Unicode):...2 Encoding:...1 Et tegn sæt (character set):...1 UTF-8 og UTF-16 (Unicode):...2 Encoding: Vi har tidligere set på spørgsmålet om et XML dokuments encoding. Det er generelt altid en god ide at gemme et dokument

Læs mere

Delphi og Databaser for begyndere

Delphi og Databaser for begyndere Denne guide er oprindeligt udgivet på Eksperten.dk Delphi og Databaser for begyndere Denne artikel handler om hvordan man udnytter noget af det bedste i Delphi: Dets gode muligheder for integrering med

Læs mere

Superskolernes kampagne

Superskolernes kampagne Superskolernes kampagne Projekt i Kommunikation/IT Roskilde Tekniske Skole Side 1 af 12 Indhold Indledning... 3 Målgruppeanalyse - Kanylemodel... 4 Begrundelse for valg af medie... 5 Grovskitsering...

Læs mere

HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside

HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside Webdesign og webkommunikation, formiddagshold (hold 1), IT Universitetet, forår 2012. Øvelse 2, individuel øvelse HTML5 fortsat: Underside, links og tekstelementer på din hjemmeside 1. Lidt om hvad du

Læs mere

Manual til administration af online booking

Manual til administration af online booking 2016 Manual til administration af online booking ShopBook Online Med forklaring og eksempler på hvordan man konfigurerer og overvåger online booking. www.obels.dk 1 Introduktion... 4 1.1 Formål... 4 1.2

Læs mere

ActiveBuilder Brugermanual

ActiveBuilder Brugermanual ActiveBuilder Brugermanual Forfatter: TalkActive I/S Dato: Juni 2004 Version: R. 1.01 Sprog: Dansk Copyright 2004 - Talk Active - all rights reserved. Indhold: 1. INDLEDNING...2 2. QUICK-START...3 3. OPBYGNINGEN

Læs mere

Opgaveteknisk vejledning Word 2016 til Mac. Tornbjerg Gymnasium 10. december 2015

Opgaveteknisk vejledning Word 2016 til Mac. Tornbjerg Gymnasium 10. december 2015 Opgaveteknisk vejledning Word 2016 til Mac Tornbjerg Gymnasium 10. december 2015 Gem!!! Så snart et dokument er oprettet skal det gemmes under et fornuftigt navn, gør det til en vane at gemme hele tiden

Læs mere

Vejledning i redigering af apotekets hjemmeside

Vejledning i redigering af apotekets hjemmeside i redigering af apotekets hjemmeside It-afdelingen Januar 2007 INDHOLDSFORTEGNELSE FEJL! BOGMÆRKE ER IKKE DEFINERET. 1 INTRODUKTION 3 2 ADMINISTRATION 4 3 OPBYGNING 4 SIDER 5 FIL ARKIV 6 ARTIKLER 7 ØVRIGE

Læs mere

I denne manual kan du finde en hurtig introduktion til hvordan du:

I denne manual kan du finde en hurtig introduktion til hvordan du: VORES NORDSJÆLLAND HURTIGT I GANG MANUAL 01: Bruger HVAD INDEHOLDER DENNE MANUAL? I denne manual kan du finde en hurtig introduktion til hvordan du: 1. Finder Vores Nordsjælland hjemmesiden 2. Opretter

Læs mere

1.0 Velkommen til manualen for Editor 1. 1.1.1 Editorens typiske udseende 1. 1.1.2 HTML-kode 1. 1.1.3 Generelle funktioner og deres ikoner 2

1.0 Velkommen til manualen for Editor 1. 1.1.1 Editorens typiske udseende 1. 1.1.2 HTML-kode 1. 1.1.3 Generelle funktioner og deres ikoner 2 1.0 Velkommen til manualen for Editor 1 1.1 Editoren 1 1.1.1 Editorens typiske udseende 1 1.1.2 HTML-kode 1 1.1.3 Generelle funktioner og deres ikoner 2 1.2 Værktøjslinjer 2 1.3 Ikoner 2 1.3.1 Liste over

Læs mere

Grafisk workflow. bl.udbudsnet.dk

Grafisk workflow. bl.udbudsnet.dk Grafisk workflow. bl.udbudsnet.dk Hvad går opgaven ud på? Opgaven gik ud på at lavet et præsentations website for Udbudsnet. Hjemmesiden skulle bruges til at sælge Udbudsnet, på en messe som hedder BL.

Læs mere

Form og dens underlige box model

Form og dens underlige box model Denne guide er oprindeligt udgivet på Eksperten.dk Form og dens underlige box model Denne artikel handler om hvilke problemer man som webudvikler kan komme ud for, og hvordan man løser dem. Jeg kommer

Læs mere

Denne rapport har til formål at redegøre for tilblivelsen af hjemmesiden beliggende på domænet, http://www.technofil.dk. Der refereres fra nu af blot

Denne rapport har til formål at redegøre for tilblivelsen af hjemmesiden beliggende på domænet, http://www.technofil.dk. Der refereres fra nu af blot Denne rapport har til formål at redegøre for tilblivelsen af hjemmesiden beliggende på domænet, http://www.technofil.dk. Der refereres fra nu af blot til hjemmesiden. Mine indledende tanker bag hjemmesiden

Læs mere

Active Builder - Brugermanual

Active Builder - Brugermanual Active Builder - Brugermanual Version: Release 2.0 Sprog: Dansk Copyright 2014 - Talk Active ApS INDHOLDSFORTEGNELSE INDHOLDSFORTEGNELSE... 2 1. HURTIGT OVERBLIK... 4 1.1 Vælg URL:... 4 1.2 Vælg en skabelon:...

Læs mere

Redaktørvejledning for www.bredstrup-pjedsted.dk Skriv en artikel

Redaktørvejledning for www.bredstrup-pjedsted.dk Skriv en artikel Arbejdsgang - Skriv artiklens tekst - Gør billeder klar - Log-in på hjemmesiden - Opret ny artikel - Vælg kategori - Skriv overskrift - Indsæt tekst - Tilføj billeder - Gennemgå artiklens indstillinger

Læs mere

Lav en hjemme side der kan sælge fly billetter til en stor i Europa.

Lav en hjemme side der kan sælge fly billetter til en stor i Europa. EKSAMENS OPGAVE Lav en hjemme side der kan sælge fly billetter til en stor i Europa. Det første jeg startede ud med var at brainstorme hvad det var jeg skulle bruge i min side da jeg nu ved hvad den skal

Læs mere

Procesbeskrivelse - Webprogrammering

Procesbeskrivelse - Webprogrammering Procesbeskrivelse - Webprogrammering Indholdsfortegnelse Forudsætninger... 1 Konceptet... 2 Hjemmesiden... 2 Server-side... 3 Filstrukturen... 3 Databasehåndtering og serverforbindelse... 4 Client-side...

Læs mere

Her vil jeg forsøge at gennemgå hvordan vi kan opnå at centrere en»div-container«både vertikalt og horisontalt i browser vinduet.

Her vil jeg forsøge at gennemgå hvordan vi kan opnå at centrere en»div-container«både vertikalt og horisontalt i browser vinduet. Side 1 Her vil jeg forsøge at gennemgå hvordan vi kan opnå at centrere en»div-container«både vertikalt og horisontalt i browser vinduet. Dette er nogle gange et ønske fra den enkelte kunde, som blot ønsker

Læs mere

Byg et website med Dreamweaver

Byg et website med Dreamweaver Byg et website med Dreamweaver I denne øvelse skal vi opbygge et website for Hotel Holiday i Dreamweaver. Det færdige site kan ses her: http://www.itu.dk/people/khhp/hotel_holidays/velkommen.html Øvelsen

Læs mere

Når du har logget dig ind, ser du Randers Kommunes byvåben midt på siden. I venstre side er der en række mapper:

Når du har logget dig ind, ser du Randers Kommunes byvåben midt på siden. I venstre side er der en række mapper: DXP vejledning Generelt: DXP er et værktøj til at fremstille præsentationsmaterialer (foldere, brochurer, løbesedler mv.) DXP egner sig kun til mindre brochurer og lign., da den største skabelon kan rumme

Læs mere

Opret en formular i Dreamweaver

Opret en formular i Dreamweaver Opret en formular i Dreamweaver. Åben det html-dokument hvor du vil have din formular skal være på. 2. Klik i det felt (DIV eller tabel) hvor du vil have din formular skal være. Du kan se du er i feltet

Læs mere

5 ARBEJDE MED EDITOREN

5 ARBEJDE MED EDITOREN 5 ARBEJDE MED EDITOREN Editor (eller Rich Tekst Editor) er et indbygget indholdsredigerings værktøj, hvor man uden nogen kendskab til HTML kodning kan skrive tekst, indsætte billeder, videoer og links.

Læs mere

ASB E-mailsignatur. Figur a: eksempel. http://asb.dk/inline/services/kommunikationsforum/skabeloner/emailsignatur.aspx og hent filen asb_signatur.zip.

ASB E-mailsignatur. Figur a: eksempel. http://asb.dk/inline/services/kommunikationsforum/skabeloner/emailsignatur.aspx og hent filen asb_signatur.zip. ASB E-mailsignatur I det følgende vil det forklares, hvordan du opretter ASBs e-mailsignatur for medarbejdere. Det skal her noteres at e-mail signaturen ikke kan opsættes i webmail (webmail.asb.dk), men

Læs mere

Lad os lave en hjemmeside. Kikker du på http://www.olehasselbalch.dk, vil du højst sandsynligt se dette.

Lad os lave en hjemmeside. Kikker du på http://www.olehasselbalch.dk, vil du højst sandsynligt se dette. Lad os lave en hjemmeside. Kikker du på http://www.olehasselbalch.dk, vil du højst sandsynligt se dette. Spørgsmålet er nu, hvordan laver man sådan en side? Du skal have et såkaldt webhotel, hvilket jeg

Læs mere

Anvendelse af metoder - Programmering

Anvendelse af metoder - Programmering Denne guide er oprindeligt udgivet på Eksperten.dk Anvendelse af metoder - Programmering En forhåbentlig rigtig god forklaring på hvad metoder er og hvordan de anvendes. Lidt om private og public, retur

Læs mere

Mit grafiske workflow inkluderer:

Mit grafiske workflow inkluderer: GRAFISK WORKFLOW Opgave: Opgaven var at producere en bog og et website med temaet stilhistorie. Jeg har valgt at beskrive mit grafiske workflow i produktionen af websitet. Kravene var, at der skulle være

Læs mere

Introduktion til redigeringsfaciliteterne

Introduktion til redigeringsfaciliteterne Introduktion til redigeringsfaciliteterne 11. august 2014 - Version 1.1 Pentia A/S Store Kongensgade 66, Baghuset 1264 København K Telefon: 7023 3330 E-mail: info@foreningssite.dk Indholdsfortegnelse Indledning...

Læs mere

Database design for begyndere

Database design for begyndere Denne guide er oprindeligt udgivet på Eksperten.dk Database design for begyndere Denne artikel beskriver hvordan man kommer fra ide til database design. Den stopper inden normal former. Den forudsætter

Læs mere

Opgaveteknisk vejledning Word 2013. Tornbjerg Gymnasium 10. december 2015

Opgaveteknisk vejledning Word 2013. Tornbjerg Gymnasium 10. december 2015 Opgaveteknisk vejledning Word 2013 Tornbjerg Gymnasium 10. december 2015 Gem!!! Så snart et dokument er oprettet skal det gemmes under et fornuftigt navn, gør det til en vane at gemme hele tiden mens man

Læs mere

poedit og oversættelse af sprogfiler

poedit og oversættelse af sprogfiler poedit og oversættelse af sprogfiler af Georg S. Adamsen WordPress.Blogos.dk 2009 http://kortlink.dk/wordpressblogosdk/6g38 1 af 11 14-04-2009 14:55 Jeg får af og til spørgsmål om, hvordan man bruger poedit,

Læs mere

Vejledning. Indhold. Side 1

Vejledning. Indhold. Side 1 Indhold HTML-faneblade... 2 Sådan tilføjer du et HTML-faneblad til din Facebook side.... 3 Sådan redigerer du et HTML-faneblad på din Facebook side.... 5 Sådan deler du fanebladet... 10 Side 1 HTML-faneblade

Læs mere

Indhold. Case 1: Introduktion 3. Case 2: Vælg og indstil tema 12. Case 3: Sider og indlæg 17

Indhold. Case 1: Introduktion 3. Case 2: Vælg og indstil tema 12. Case 3: Sider og indlæg 17 1. udgave 2012 Udgivet af Softworld Kurser A/S Kopiering samt gengivelse af indholdet er ikke tilladt, medmindre der er givet skriftlig tilladelse herom. Copyright Softworld Kurser A/S Forfatter: Martin

Læs mere

PHP kode til hjemmeside menu.

PHP kode til hjemmeside menu. PHP kode til hjemmeside menu. Home Hovedmenu 1 Hovedmenu 2 Hovedmenu 3 Hovedmenu 4 Undermenu 1 Breadcrumb Her vises indholdet af den valgte side Undermenu 2 Undermenu 3 Undermenu 4 Evt. en mulighed for

Læs mere

Du skal gemme kalenderen på din computer, før du åbner den, ellers virker makroerne ikke.

Du skal gemme kalenderen på din computer, før du åbner den, ellers virker makroerne ikke. Makroer Når du åbner kalenderen, bliver du sikkert spurgt, om du vil åbne med eller uden makroer (om boksen med valgmulighederne dukker op afhænger af, hvilket niveau sikkerheden i Excel er indstillet

Læs mere

Mini-guide for opdatering af hjemmesiden for. SOIF www.soif.dk

Mini-guide for opdatering af hjemmesiden for. SOIF www.soif.dk Mini-guide for opdatering af hjemmesiden for SOIF www.soif.dk Senest opdateret: 03-07-2009 Indholdsfortegnelse 2 Indholdsfortegnelse 2 Lidt generelt om KlubCMS 3 Brugere/Brugergrupper 3 Sideopbygning:

Læs mere

Vejledning i oprettelse og anvendelse af studiedokumenter

Vejledning i oprettelse og anvendelse af studiedokumenter Vejledning i oprettelse og anvendelse af studiedokumenter Dokumenter som alle kan skrive i Udover meddelelser (breve og konferenceindlæg) er det muligt at oprette dokumenter og præsentationer på SkoleKom.

Læs mere

Manual for installering og brug af IE-spyad af Anette B. Overgaard

Manual for installering og brug af IE-spyad af Anette B. Overgaard Manual for installering og brug af IE-spyad af Anette B. Overgaard Jeg kan varmt anbefale alle at installere dette lille geniale program. Det sikrer dig mod rigtig meget spyware, som ligger rundt omkring

Læs mere

OK Fonden. Umbraco CMS Quickguide

OK Fonden. Umbraco CMS Quickguide OK Fonden Umbraco CMS Quickguide 1 Indhold 1 Indhold... 2 2 Indledning... 3 2.1 Kompatible browsere... 3 2.2 Log ind i Umbraco... 3 2.3 Naviger i administrationsområdet... 4 2.4 Brug af træ menu... 5 3

Læs mere

KODNING AF RESPONSIV DESIGN

KODNING AF RESPONSIV DESIGN Grafisk Workflow REDEGØRELSE GRAFISK WORKFLOW 39 OPGAVEN Frk. Nielsens rengøringsfirma kom til os for at få lavet ny hjemmeside. Hun var træt af den gamle, da hun ikke kunne rette i indholdet, og valgte

Læs mere

Password-beskyttelse af visse filer

Password-beskyttelse af visse filer W EB DESIGN 101 K ODEORDSBESKYTTELSE A F VISSE FI LER Password-beskyttelse af visse filer P å et websted kan det være interessant kun at give en del af brugerskaren adgang til visse filer. Der er en mængde

Læs mere

Velkommen til Stifikseren!

Velkommen til Stifikseren! Powered by Velkommen til Stifikseren! Du har nu fået et meget effektivt værktøj til på én gang at lette dit arbejde og kvalificere dine elevers udbytte af deres og din indsats i forhold til deres skriftlige

Læs mere

Brugervejledning til InfoLand.dk skabelonen

Brugervejledning til InfoLand.dk skabelonen Indhold Indledning... 4 Første gang... 4 Log ind som Administrator og ændre kodeord... 4 Opret Redaktør (dig selv)... 4 Log ind... 4 Log ind med dit eget brugernavn ( Redaktør )... 4 Log ind som Administrator...

Læs mere

Naja Schlüter Roskilde Tekniske Gymnasium 26/ Interessentanalyse

Naja Schlüter Roskilde Tekniske Gymnasium 26/ Interessentanalyse Interessentanalyse Jeg fik til opgave at skulle lave en ny studieweb som er min egen personlige side. Min studieweb skal bruges til lidt information og så vil jeg løbende igennem de to år jeg har igen

Læs mere

INTRODUKTION TIL DIAGRAMFUNKTIONER I EXCEL

INTRODUKTION TIL DIAGRAMFUNKTIONER I EXCEL INTRODUKTION TIL DIAGRAMFUNKTIONER I EXCEL I denne og yderligere at par artikler vil jeg se nærmere på diagramfunktionerne i Excel, men der er desværre ikke plads at gennemgå disse i alle detaljer, dertil

Læs mere

Konstruktion af websites - 1. kursusgang Øvelse 1 opsætning af tekst

Konstruktion af websites - 1. kursusgang Øvelse 1 opsætning af tekst Konstruktion af websites - 1. kursusgang Øvelse 1 opsætning af tekst Lav ved hjælp af teksteditor og browser en webside, der indeholder elementer som den herunder - tilføj desuden din udgave af hjemmeside

Læs mere