Oppsummering fra forelesning 2
|
|
|
- Anette Kristiansen
- 8 år siden
- Visninger:
Transkript
1 1 of :42 Oppsummering fra forelesning 2 Lenker Lenker er, historisk sett, webens første eksistensberettigelse Lenker kan være relative (går til sider innenfor samme nettsted) eller absolutte (går til eksterne nettsider/steder) Lenker kan også stiles, med såkalte pseudo-klasser (a:link, a:visited, a:hover, a:active), som indikerer lenkens status Selektører: Klasser, IDer, tagger og kombinerte Mens klasser (for eksempel.kode) er stilelementer (selektører) som kan anvendes på flere (hvilke som helst) elementer... Er IDer (for eksempel #meny) unike i siden (skal bare brukes på et element). En stil med #ID som selektør gjelder bare ett bestemt element. Kombinerte selektører kan begrense en stil til å gjelde en tagg, bare hvis den er innenfor en bestemt kontekst: Konteksten bestemmes av en kombinasjon av tagger, klasse og/eller IDer. Eksempel: div#container ul li kommer til å stile en listeinnførsel som er innenfor en punktliste, som er innenfor en div med id container DW - utlegg DW legger til rette for at sideutlegg kan enkelt organiseres i stilede div-inndelinger. Det er enkelt å omslutte tekstmengder med diver plassere en (i utgangspunkt tom) div et bestemt sted i siden stile div'er se div'ene i DW-designmodus
2 2 of :42 Bakgrunner Bakgrunner kan i DW kontrolleres for hele skjermbildet (alt av nettsiden som måtte vises samtidig i et nettleservindu) og enkeltelementer DW gjør det relativt enkelt å velge bakgrunner av både farger og bilder. Det går an å velge både farger og bilder som bakgrunn for en nettside Bakgrunn bør velges varsomt, for å ta vare på nettsidens lesbarhet. kontrast er et viktig kriterium Her skal vi se på bakgrunn for hele nettsider, men prinsippene gjelder stort namge andre elementer. Bakgrunner for div'er og hele siden. Et vanlig oppsett er å ha en div innenfor body som omfatter resten av innholdet. I Dreamweavers ferdige sideutlegg har denne div-en class 'container', som ligger rett innenfor body-elementet... <body> <div class="container">... </div> </body> </html> Bakgrunnsfarge for hele siden Div-en til et fixed sideutlegg har følgende stilarkregler: Bredden (med innholdet) er satt til 960px. Det er midstilt i nettleseren ved hjelp av 'margin: auto' (0 betyr at det er ingen margin øverst eller nederst). Bakgrunnen er satt til hvit (#FFFFFF)..container { width: 960px; background: #FFFFFF; margin: 0 auto; /* 0 = øverst nederst auto=sidemarger*/ }
3 3 of :42 For å endre bakgrunnsfarge for hele siden Hvis body allerede har stilarkregler kan body velges fra listen under All Rules: Hvis en bakgrunn er oppgitt som ovenfor kan det endres ved å klikke på blyantknappen. Hvis body ikke finnes i listen, dvs. ingen regler for body er definert, klikk på +-knappen nederst i CSS-ruten,. Velg: Selector Type: Tag Selector Name: body Rule Definition: stilarket reglene skal lagres i Regelen for bakgrunnsfarge finnes under kategorien Background:
4 4 of :42 Med hvit som bakgrunnsfarge for container og #666 (samme som #666666) som bakgrunnsfarge for body vil nettsiden se slik ut: Background-regler kan settes på de alle fleste tagger, ikke bare body. Bruk et bilde som bakgrunn Velg f.eks. body eller 'container' som selektør og legg til en stilarkregel. Selector Type: Tag Selector Name: body Rule Definition: stilarket reglene skal lagres i Regelen for bakgrunnsfarge finnes under kategorien Background: Bakgrunnsbilde velges i feltet Background-image i kategorien Background: Alle bildeformater som brukes sammen med img-tagg kan brukes her. Både relativ- og absoluttadresser til bildefil kan brukes.
5 5 of :42 Nettlesere kan oppfører seg forskjellige på måten de, uten egen formattering viser bakgrunnsbildet noen nettlesere vil da gjenta bildet for å fylle hele siden slik: NB! Bruk av bilde under løpende tekst bør unngås. gjør lesing vanskelig og dermed forringer tilgjengelighet og brukskvaliteten til nettsiden. Background-repeat regelen Background-repeat regelen bør brukes for å bestemme om nettleseren skal gjenta bildet eller ikke. Hvis du vil at bildet skal gjentas velg repeat under Background-repeat. NB! Bruk av bilde under løpende tekst bør unngås. gjør lesing vanskelig og dermed forringer tilgjengelighet og brukskvaliteten til nettsiden.
6 6 of :42 For å unngå at bildet gjentas velg no-repeat under Background-repeat. Resultatet ser du til høyre, Det går an å repetere bildet bortover (repeat-x) og nedover (repeat-y) Background-size regelen Det finnes en ny regel i CSS3 som heter background-size som kan brukes for å tvinge bakgrunnsbilde til å fylle hele bakgrunn. Sett background-repeat til no-repeat og legg inn regel background-size med verdiene 100% 100%. Regelen finnes ikke under kategorien Background, men kan legges inn ved å klikke på Add Property og finne fram i listen. De fleste nye nettlesere har støtte for regelen, se /litmus/#css3-properties.
7 7 of :42 plassering av et bilde Hvis bildet ikke gjentas (no-repeat), er det vanlig å plassere bildet. gjøres ved hjelp av Background-position (X) og Background-position (Y). Verdier for X:lefter, center, right Verdier for Y:top, center og bottom Kombinasjonen bestemmer bildets plassering Nøyaktig plassering kan også oppgis i piksler, målt fra øverste venstre hjørne. Tilslutt kan man også bestemme Background-attachment bakgrunnsbildet enten ruller sammen med teksten (scroll) eller sitte fast mens teksten ruller (fixed). Scroll er det mest vanlige.
8 8 of :42 Plassering Det skilles mellom to hovedtyper plasseringsoppførsel til HTML-elementer (css displayregel): inline - starter ikke nye linjer. Eksempler er lenker (a), tegn, osv. Inline elementer ikke høyde og bredde, med untak av bilder. block - nettleseren begynner en ny linje og setter luft over og under blokk-elementer. Eksempler på slike tagger er tabell (table), lister (ul, ol), listepunkter (li), overskrifter (h1-6), avsnitt (p). Kan settes høyde og bredde. Bilder er litt spesielle her, I utgangspunktet inline, men har noen spesielle regler knyttet til seg, for eksempel ved at de har bredde og lengde, som inline elementer stort sett ikke har. Vi kan kontrollere plassering av bilder med hjelp av css. stort sett er box-og positioning-kategoriene relevante her. "Vanlig" plassering i Dreamweaver "Vanlig" plassering av et bilde i DW ser umiddelbart ut slik: Dette er fordi hvis vi tasted 'enter' før plasseringen, blir bildet automatisk plassert slik innenfor en <p><img...></p> tagg. plasserer vi bildet inntil teksten <p><img...> Lorem ipsum...</p>, plasseres bildet som om det var et vanlig tegn. bortover. Bildet bestemmer også høyden på linjen det står i.
9 9 of :42 Direkte kontroll av plassering Plassering kan endres ved å bruke float-regelen (finnes under kategorien Box) i stilark. F.eks. float:left gir følgende resultat: For mer detaljert plassering kan reglene som finnes under kategorien Positioning brukes: Static - elementets vanlige plassering Relative - forkjøvet (+-) i forhold til den statiske positionen Absolutt - x og y coordinater fra venstre-øverste hjørne Fixed - "står stille" mens resten av siden ruller. Statisk plassering: bildets plassering uten forflytning Vi antar at bildet er plassert slik, og at plasseringer som følger nedenfor tar utgangspunkt i denne.
10 10 of :42 Relativ plassering: relativ i forhold til hva den ville vært som static. Forflytning (fra static) bestemmes under "Placement". Top brukes for å flytte den oppover (f.eks. -20px = oppover 20 piksler) eller nedover (f.eks. 20px = nedover 20 piksler). Left brukes for å flytte til venstre (f.eks. -30px) eller til høyre (f.eks. 30px). Absolutt plassering:elementet er plassert i forhold til øverste venstre hjørne av "foreldreelementet" (den første som har en posisjon) eller av nettleseren, slik som bakgrunnsbilder overfor. Når et element har absolute plassering vises en firkant øverst til venstre. Dette kan brukes for å dra elementet til ønsket plassering. Stilarkregler oppdateres automatisk i etterkant. Forflytning (fra øverst venstre i )bestemmes under Placement. Top brukes for å flytte den oppover (f.eks. -20px = oppover 20 piksler) eller nedover (f.eks. 20px = nedover 20 piksler). Left brukes for å flytte til venstre (f.eks. -30px) eller til høyre (f.eks. 30px). Fixed Elementet ( i det tilfelle et bilde) sitter fast, mens resten av siden ruller. (Kan være nyttig om man ønsker at menyen skal synes langs hele dolumentet.)
11 11 of :42 Z-Index Ved bruk av plassering kan vi komme i en situasjon der et element plasseres opp på et annet. For å bestemme hvilket som plasseres øverst brukes z-index. Det elementet som har høyest z-index vises på toppen. Bildet med z-index = 1000 Bildet med z-index = Overflow Det er mulig under både Positioning og Box å bestemme høyden (height) og bredden (width) av elementer. Men hva skjer hvis det ikke er plass til innholdet innenfor de oppgitte størrelsene? En div med tekst som overskrider dimensjonene Regelmeny for behandling av overflow-situasjoner
12 12 of :42 De forskjellige valgene Visible Dette er det vanlige valget, som i bildet ovenfor. Her er også teksten som er utenfor den angitte blokkstørrelsen synlig. Hidden Det som ikke får plass, skjules. Teksten etter hører ikke scroll Div-en vil alltid vises med et rullefelt uansett størrelsen på innholdet: Dette selv om det måtte være plass til hele innholdet (i motsetning til auto, se lenger ned). Rullefelt vises ikke i Dreamweaver. Redigeringen av innholdet i div-en aktiviseres med en dobbeltklikk. Auto Rullefeltet vises kun når innholdet er større enn størrelse på div-en. Her vil rulleteksten forsvinne hvis siden redigeres og teksten gjøres mindre slik at den inngår i rektangelet.
13 13 of :42 Litt mer om bilder Bilder redigeres stort sett i dertilegnede redigereringsprogrammer Dreamweaver tilbyr noen fasiliteter som muliggjør kjapp redigering av bilder i selve verktøyet. Herunder: utklipping av et bildeutdrag, skalering, endring av oppløsning osv. Når et bilde er aktivt (img-taggen nederst til venstre er klikket på) endres Properties-ruten slik: Noen av opplysninger som vises her er: en liten utgave av bildet størrelsen i kilobyte (K) av bildet, f.eks. 107K - husk store bilder tar lang tid å overføre og kan forsinke visning av siden. størrelsen i piksler - bredden (W) og høyden (H) Src - adressen til bildefil Link - hvis bildet er klikkbart, dvs. fungerer som en lenke til en annen side, vises adressen her Alt - alternativ tekst som vises når bilde ikke kan vises. Husk - gode, meningsfulle tekster hjelper siden å være tilgjengelig for flere og bildet søkbart i Google. Her har vi også mulighet for å koble en ID eller en klasse til bildet.
14 14 of :42 Bildet er for stort - velg ut en del Bildet kan endres i bildebehandlingsprogrammer. I tillegg finnes det en redigeringsmulighet i Dreamweaver. Velg Crop-knappen som finnes til høyre for Edit i Propertiesruten. Vær oppmerksom på at du endrer det opprinnelig bildet og det kan være lurt å ta en kopi først. Dreamweaver viser en advarsel om dette når Crop-knappen velges. NB det er mulig å bruke Edit > Undo for å angre rett etter oppdateringen. Dra i strekene rundt den opplyste firkanten for å velge ut en del av bildet. Bruk Enter (Retur) når redigering er ferdig bildet kan være uskarpt etter operasjonen. Bruk "Resampleknappen.
15 15 of :42 Litt mer om lister Liste-tagger kan velges før eller etter at innholdet skrives i dokumentet. Tupen liste kan også endres Liste-taggene ul, ol, li, dl, dt og dd finnes under Text i Insert-ruten. Relativt lett å kontrollere listens utseende, type punkter, og innrykket av listeelementer. Endre en liste fra en ul til en ol eller omvendt Velg et av listepunktene og deretter velg hele listen (ul eller ol) i Tag Selector: Velg ol-knappen under Text i Insert-ruten for å endre listetypen til "ordnet liste". Liste med flere nivåer? Skriv hele listen enten som ol eller ul. Marker listepunktene som skal være på underlisten og klikk på Text Indent-knappen i Properties-ruten: Ved bruk av properties-ruten, klikk "indent"-knappen De merkede listepunktene gjøres om til en underliste Legg merke til Tag Selector som viser at de merkede listepunkter er nå en liste (ul) innenfor et listepunkt. Dette tilsvarer: <ul> <li>punkt 1 <ul> <li>punkt 1-1</li> <li>punkt 1-2</li> </ul> </li>...
16 16 of :42 Endre utseende på en liste Velg listen det gjelder ved å sette markøren på et listepunkt i listen og deretter velge listen (ul eller ol) i Tag Selector. Evt. bruk en ID eller en klasse hvis stilarkreglene ikke skal gjelde alle lister av typen i dokumentet. Klikk på New CSS Rule-knappen (evt. Edit Rule-knappen hvis det allerede finnes regler for listen). Valgene finnes under kategorien List: Valget none under List-style-type vil fjerne / tallene / bokstavene foran punktene. Resultatet av bruk av Liste-style-Position er slik: Outside er det vanlig presentasjon av listen, mens inside flytter punktmarkeringer innenfor listepunktets innhold. Øvelser Øvelser til Dreamweaver 3. Bildet er tatt av Fabiovenni og er beskyttet av CC BY-SA 2.0 lisensen. Dette verk er lisensiert under en Creative Commons Navngivelse-Ikkekommersiell-Del på samme vilkår 3.0 Unported lisens. Michael Preminger, michael.preminger@hioa.no,
CSS-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
file:///c:/users/michaelp/sites/dkdm/dw4/dreamweaver4o.html
1 of 8 02.04.2015 20:45 Oppsummering fra forrige gang Bakgrunner i DW kan lages både med farger og bilder kan brukes til å lage tiltalende design, skal derimot være obs. på at kontrasten til innholdsteksten
Oppsummering fra forelesning 1
1 of 25 01.04.2015 16:26 Oppsummering fra forelesning 1 HTML har å gjøre med innhold og struktur skal strengt tatt bare brukes til slikt. alt annet med css CSS kontrollerer utseende: utlegg, skrift og
file:///c:/users/michaelp/sites/dkdm/dw5/dreamweaver5_1.html
1 of 10 09.04.2015 15:49 Fra forrige gang: Om tabeller Tabeller er i utgangspunktet en måte å presentere data på. Skal ikke brukes for å legge ut sider Dreamweaver har fasiliteter for å opprette, redigere
Steg 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
I 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
TENK TECH SUMMERCAMP BYGG DIN EGEN NETTSIDE
TENK TECH SUMMERCAMP BYGG DIN EGEN NETTSIDE JULIE HILL ROA MIRA THOEN FEIRING HVA ER WEBUTVIKLING? SERVER KLIENT HTTP request HTML, CSS, JavaScript HTTP response HTML Innhold CSS Utseende JAVASCRIPT Oppførsel
HTML: 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
MMT105 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
Tilpassning av Wordpress - Enterprise Theme
Del 2 - Tilpassning Tilpassning av Wordpress - Enterprise Theme Del 1 var en gjennomgang av hvordan man setter opp det tekniske som kreves for å kjøre en Wordpress webside/blogg. Installere webserver (Apache)
file:///c:/users/michaelp/sites/dkdm/dw6/dreamweaver6.html
1 of 9 15.04.2015 14:15 Spry og behaviours Både Spry and Behaviours er basert på programmeringsspråket Javascript. Javascript kjører i nettleseren og ikke på webserver som PHP og Perl. På en lignende måte
EKSAMEN 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
CSS: 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
Bildebehandling i GIMP
Bildebehandling i GIMP 9.1 Opprette et dokument & 9.2 Bildestørrelse For å opprette et nytt dokument velger du File > New (Fil > Ny...) Da vil følgende vindu dukke opp: Her er bildets oppløsning satt til
Steg 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
EKSAMEN 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
Kursdokumentasjon 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
Oblig 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
Oblig 2: Oppgave 1. section { width: 50%; height: 30%; margin: 5% 0 0 0; } h1 { color:#000000; font-size:2em;
Oblig 2: Oppgave 1 Hva og hvorfor Jeg har valgt å lage et nettsted basert på relative målenheter. Det vil si at jeg tar i bruk prosent og em istedenfor pixler. For eksempel: section { width: 50%; height:
Oppgave 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
Høgskolen i Telemark EKSAMEN Webpublisering (inkludert denne) Hjelpemiddel: Ingen
Høgskolen i Telemark Fakultet for allmennvitenskapelige fag EKSAMEN 6101 Webpublisering 05.12.2013 Tid: Målform: Sidetal: 3 timer Bokmål 7 (inkludert denne) Hjelpemiddel: Ingen Merknader: Alle oppgavene
CASCADING 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
I 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
"Dette skjer når jeg trykker på denne knappen" "Når jeg skriver i dette feltet, ser jeg at det andre forandrer seg"
Tegning med SVG Skrevet av: Teodor Heggelund Kurs: Elm Tema: Tekstbasert, Nettside Fag: Programmering, Teknologi Klassetrinn: 8.-10. klasse, Videregående skole Introduksjon I denne oppagaven skal vi lære
BRUK 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
Innhold. ailæring Lage/endre leksjon. Innledning Lage en leksjon Legge inn tekst, kulepunktliste og bilde... 6
Lage/endre leksjon 1 Innhold Innledning... 2 Lage en leksjon... 3 Legge inn tekst, kulepunktliste og bilde... 6 Kopiere og lime inn tekst fra andre programmer... 10 Bygge inn en video... 10 Sette inn hyperkobling...
Administrering 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...
<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
Hå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
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.
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
Publiseringsveiledning for www.tromsfylke.no
Publiseringsveiledning for www.tromsfylke.no Sist oppdatert 09.07.2013 av Khalil Dahbi Innholdsliste 1. Side:... 3 a. Lage en ny side:... 3 b. Endre innstilling til en side:... 3 c. Slette en side:...
Mer om stiler og stilark. Layout. Litt Design
Mer om stiler og stilark. Layout. Litt Design Webpublisering 13.09.2004 Webpublisering - HiO - Kirsten Ribu - 2004 1 I dag Struktur på hjemmesiden Mer om stiler Stiler og layout Litt om design og farger
HTML5 og CSS. Webdesign med Dreamweaver. Glemmen vgs - Medier og kommunikasjon 1. januar Arly Dale 2013 Side 1
Webdesign med Dreamweaver Glemmen vgs - Medier og kommunikasjon 1. januar 2013 Arly Dale 2013 Side 1 Strukturere layout på en webside Layouten på en webside kan organiseres på forskjellige måter. Tidligere
Brukermanual til Domenia Norges adminløsning
Brukermanual til Domenia Norges adminløsning 1. Login For å logge inn på løsningen din skriver du inn domenenavnet ditt og /siteadmin (f.eks www.domenia.no/siteadmin ). Skriv inn brukernavn og passord
Manual 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
Oblig 3 Webutvikling. Oppgave 1
Oblig 3 Webutvikling Oppgave 1 Ta for deg en selvvalgt bedrift (gjerne lokal/mindre) og tenk deg at du hadde fått i oppgave å være en SEOkonsulent for disse i én uke. På denne uken skulle du gjennomført
PUBLISERING AV INNHOLD TIL KVAMSSIDA.NO
PUBLISERING AV INNHOLD TIL KVAMSSIDA.NO Innhold Kapitel 1 - Registrering og innlogging... 2 Kapitel 2 - Lage ny artikkel uten bruk av bilder eller annen grafikk... 3 Kapitel 2a - Ingress... 4 Kapitel 3
OBLIG 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
Webutvikling 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å
KOMME I GANG 3. Logge på 3. I redigeringsvinduet 4 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 6
Innhold KOMME I GANG 3 Logge på 3 I redigeringsvinduet 4 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 6 Lukk 7 Ny 7 Flytt opp/ Flytt ned 7 Klipp 8 Kopier 8 Lim inn (krysspubliser, ny,
Rammer. 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
Hå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
KOMME I GANG 2. Logge på 2. I redigeringsvinduet 3 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 5
Innhold KOMME I GANG 2 Logge på 2 I redigeringsvinduet 3 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 5 Lukk 6 Ny 6 Flytt opp/ Flytt ned 6 Klipp 7 Kopier 7 Lim inn (krysspubliser, ny,
CSS: 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å
CSS: 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
Oppbygging 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
Brukerveiledning wikispaces. Kursholder Kari Saasen Strand
Brukerveiledning wikispaces Kursholder Kari Saasen Strand Våren 2011 2 Innhold Hvordan lage en wiki?... 4 Opprette konto.... 4 Rediger din side... 5 Manage wiki... 5 Rediger din velkomstside... 6 Verktøymeny...
Bruksanvisning for publisering på www.fysio.no
EZ Publish Bruksanvisning for publisering på www.fysio.no Gå til http://admin.fysio.no. OBS: Legg merke til at du ikke skal ha med www. Skriv inn brukernavn og passord. Nå er du klar til å redigere artiklene:
Brukermanual. www.bygdekvinnelaget.no
Brukermanual www.bygdekvinnelaget.no Viktige endringer Nye Bygdekvinnelaget.no er lagt opp på en måte der brukere og redaktører står for innhold, mens systemet i enda større grad en tidligere står for
Bygge en pyramide. Steg 1: Lage en ny mod. Sjekkliste. Introduksjon
Bygge en pyramide Introduksjon Learn To Mod Introduksjon La oss gjøre som Egypterne og bygge en pyramide! Denne oppgaven har ikke så detaljerte instruksjoner som "Bygge en kube", den passer fint som oppgave
Steg 1: En første animasjon
Halloweenimasjon Skrevet av: Torbjørn Skauli og Geir Arne Hjelle Kurs: Scratch Tema: Blokkbasert, Animasjon Fag: Programmering, Engelsk, Kunst og håndverk Klassetrinn: 1.-4. klasse, 5.-7. klasse, 8.-10.
praktiske eksempler DOM Document Object Model DOM og Høst 2013 Informasjonsteknologi 2 Læreplansmål Gløer Olav Langslet Sandvika VGS
DOM og praktiske eksempler Gløer Olav Langslet Sandvika VGS Høst 2013 Informasjonsteknologi 2 DOM Document Object Model Læreplansmål Eleven skal kunne programmere med enkle og indekserte variabler eller
Den beste måten hvis du skal endre allerede eksisterende artikler
OPPLÆRING I NETTPUBLISERING MED JOOMLA 3 Sist oppdatert: 2. October 2018 13:49 redigering fra FORSIDEN Den beste måten hvis du skal endre allerede eksisterende artikler Side 2 Innhold Forsiden - redigere
EKSAMEN / 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
Pålogging nettsider Fjellhamar FK
Pålogging nettsider Fjellhamar FK For å kunne legge ut nyheter og informasjon på lagsidene, må man først logge seg på med brukernavn og passord. Etter å ha åpnet nettsiden til FFK, gjør du som følger:
Brukermanual Infoskjermer
Brukermanual Infoskjermer Innhold Førstegangs oppsett av Philips infoskjerm... 2 Pålogging til Xibo... 3 Lag din første Layout / Plakat... 3 Nå skal vi velge bakgrunnsbilde og bakgrunnsfarge... 3 Nå skal
Bilder, tabeller. Kirsten Ribu 26.09
Bilder, tabeller Kirsten Ribu 26.09 1 Repetisjon: div taggen Blokker () Et (X)HTML-dokument kan deles inn i blokker med og hver blokk må avsluttes med . Blokker benyttes i dokumenter der
Bygge en pyramide. Introduksjon. Steg 1: Lage en ny mod. Sjekkliste. Skrevet av: Pål G. Solheim
Bygge en pyramide Skrevet av: Pål G. Solheim Kurs: Learntomod Tema: Blokkbasert, Minecraft Fag: Programmering, Teknologi Klassetrinn: 1.-4. klasse, 5.-7. klasse, 8.-10. klasse Introduksjon La oss gjøre
Halloweenimasjon Introduksjon Scratch PDF
Halloweenimasjon Introduksjon Scratch PDF Introduksjon Vi vil her se på hvordan vi kan lage forskjellige animasjoner med et Halloween-tema. Disse kan vi enten dele med vennene våre gjennom Scratch, eller
Her er en enkel bruksanvisning på administrasjonspanelet til hjemmesiden din på QTSystems.
Her er en enkel bruksanvisning på administrasjonspanelet til hjemmesiden din på QTSystems. Redigert 10.februar 2010. For at det skal bli lettere å lese denne manualen kan du justere størrelsen på dette
BRUKERMANUAL KOM I GANG... 2 BLOGGINNLEGG... 4 UNDERSIDER... 6 LAST OPP BILDER/VIDEO... 8 KOMMENTARER PÅ INNLEGG... 9 UTSEENDE...
BRUKERMANUAL KOM I GANG... 2 SKRIV ET INNLEGG... 2 LEGG TIL UNDERSIDE... 2 LAST OPP BILDER... 2 REDIGER MENYINNHOLD... 3 LEGG INN SIDEMENY ELLER BUNNTEKST... 3 TILPASS BLOGGENS DESIGN... 3 BLOGGINNLEGG...
WWW.POLARPRODUKSJON.NO
GUIDE RSHL.NO Av Fredrik Mediå Oppgraderingen av nettstedet RSHL.NO har ført til at det kan oppstå en del spørsmål og forvirringer rundt hvordan forskjellige elementer fungerer. Denne guiden skal fungere
23. Spillere. For spillere i Postenligaen og 1.div.
23. Spillere For spillere i Postenligaen og 1.div. Hva kan du gjøre? Alle spillere har egne nettsider som er knyttet til sin unike ID i NHF sin database. Alt du lager her vil være knyttet til deg og din
Del 1: Overgang fra gammel hjemmeside til ny hjemmeside
Del 1: Overgang fra gammel hjemmeside til ny hjemmeside Instituttsider og personlige hjemmesider som ligger på HFs egen webserver skal nå fases ut.dette innebærer at alle som fortsatt har hjemmesider der,
BORRENYTT. Dette er en innføringsguide om hvordan man kan legge til nye poster, og hvordan disse bør settes opp.
Dette er en innføringsguide om hvordan man kan legge til nye poster, og hvordan disse bør settes opp. I denne guiden skal jeg ta for meg hvordan man kan legge til eller endre tekst, opprette nyheter og
Veiledning hjemmeside Stjørdal Friidrettsklubb
Veiledning hjemmeside Stjørdal Friidrettsklubb Hjemmesida med adressen www.sfik.no er åpen for alle. Hvis du skal publisere et innlegg på hjemmesida må du logge deg inn med brukernavn og passord. Dette
Web-tjenester for presentasjon av sportsdata (fotball). v. 3.0, 23/2/2014
BRUKERVEILEDNING Web-tjenester for presentasjon av sportsdata (fotball). v. 3.0, 23/2/2014 Innholdsfortegnelse 1 Innledning... 3 1.1 Abonnement... 3 1.2 Begrensninger i bruk av tjenestene... 3 1.3 Tekniske
Publisere på nvfnorden.org
Kommunikasjonsgruppen i NVF Publisere på nvfnorden.org En guide til de viktigste funksjonene i publiseringsverktøyet LiSA Live, 2. utg. Johanne Solheim 22.02.2013 Innhold Introduksjon... 1 Logg deg på...
Bygge en kube. Steg 1: Lage en ny mod. Sjekkliste. Introduksjon
Bygge en kube Introduksjon Learn To Mod Introduksjon Vi skal bygge en kube i minecraft og lære endel viktige klosser i Learn To Mod. Oppgaven er forklart i detalj og egner seg som den første oppgaven du
WordPress. Brukerveiledning. Kjære kunde. Innlogging:
Brukerveiledning WordPress Sist oppdatert: 26.02.2014 Kjære kunde Her er en liten guide for å hjelpe deg gjennom det grunnleggende i Wordpress. Denne veilederen vil ta deg gjennom: Innlogging - s.1 Kontrollpanel
jazzprofil-blogg Hvordan opprette og bruke din egen blogg på jazzprofil.no
Nettsamfunnet for jazz i Norge jazzprofil-blogg Hvordan opprette og bruke din egen blogg på jazzprofil.no Her er en kort bruksanvisning for deg som vil lage din egen blogg gjennom Jazzprofil. Vi forklarer
Brukerdokumentasjon for LabOra portal - forfattere
Brukerdokumentasjon for LabOra portal - forfattere Skin: Dnnbest-Grey-Skin1024 Skin: Metro7 Custom LabOra web-portal er et web-basert publiseringsprogram for publisering av informasjon på hjemmesider.
Brukerveiledning. Innlogging, profil og firmaopplysninger, opplasting av bilder og innlegging av portfolio. idaf 15.08.2012
Brukerveiledning Innlogging, profil og firmaopplysninger, opplasting av bilder og innlegging av portfolio idaf 15.08.2012 Dette dokumentet skal sørge for at alle NIL-medlemmer har en oppdatert profil og
Communicate SymWriter: R1 Lage en tavle
Communicate SymWriter: R1 Lage en tavle I denne delen beskrives egenskaper som kan brukes for å lage en tavle til å skrive med. Stort sett vil du bare ha bruk for en del av dette når du lager skrivemiljøer.
CSS: Endre utseende og stil på tekst Nybegynner
CSS: Endre utseende og stil på tekst Nybegynner Web Introduksjon I denne oppgaven skal vi jobbe videre med skrift, størrelser og farger. Vi skal utforske forskjellige skrifttyper, se på bakgrunnsfarger
www.ir.hiof.no/~eb/viz.htm Side 1 av 12
VIZhtm Side 1 av 12 Innhold Side MÅL 1 OPPGAVE / RESULTAT 1 BESKRIVELSE ØVING 6A 2 BESKRIVELSE ØVING 6B 9 BESKRIVELSE ØVING 6C 12 MÅL Når du har utført denne øvingen, skal du kunne: Benytte et kamera som
SP Production. mywysiwyg User Guide. Version 1.0 2011-03-01 1
SP Production mywysiwyg User Guide Version 1.0 2011-03-01 1 Innholdsfortegnelse 1 Innledning 2 Innlogging 3 Administrasjonsverktøy.1 Utseende og hovedfunksjoner.1 Section.2 Content.3 Link archive 4 Editor
Radix en enkel innføring
Radix en enkel innføring Dette er en enkel oppskrift på den mest vanlige bruken av Radix. 1 Utgangspunkt: Du har laget en video som du vil dele med dine studenter i Fronter. Du kan da bruke Radix som lagrings-
BRUKERMANUAL (versjon 1.0)
BRUKERMANUAL (versjon 1.0) 1. Innlogging Du må ha en egen bruker for å kunne logge inn på nettsidene. Du logger inn ved å scrolle helt nederst på forsiden av Forbundet.no, til det svarte feltet, og trykke
OBLIG 2 WEBUTVIKLING
OBLIG 2 WEBUTVIKLING Oppgave 1 Design ved hjelp av skisser eller wireframes et nettsted med et "avansert" design. Lag spesifikke design for ulike skjermstørrelser og utskrift. Fokuser spesielt på å få
SymWriter: R6 Innstillinger, preferanser og verktøylinjer
SymWriter: R6 Innstillinger, preferanser og verktøylinjer Innhold R6.1 Startinnstillinger og utseende...3 R6.2 Tekst og bilder...................................................4 R6.3 Tale og staving...5
Løpende strekmann Erfaren Videregående Python PDF
Løpende strekmann Erfaren Videregående Python PDF Introduksjon I denne oppgaven skal du lage et spill der du styrer en strekmann som hopper over hindringer. Steg 1: Ny fil Begynn med å lage en fil som
Konfirmantmodul integrert i LabOra Portal
Konfirmantmodul integrert i LabOra Portal Denne modulen gjør det mulig at konfirmantene SELV kan registrere informasjon om seg selv og sine foresatte ved påmelding til konfirmasjon. I tillegg kan det defineres
KOM I GANG MED WORDPRESS En enkel guide for å hjelpe deg gjennom det grunnleggende i Wordpress
KOM I GANG MED WORDPRESS En enkel guide for å hjelpe deg gjennom det grunnleggende i Wordpress Sist oppdatert 05.06.2015 Innholdsfortegnelse 1. Hva er Wordpress?... 3 2. Hvordan logger jeg inn i kontrollpanelet?...
Slik lager du et web-område bestående av flere sammenhengende websider i. Frontpage 2003. Laget av Magnus Nohr Høgskolen i Østfold
Slik lager du et web-område bestående av flere sammenhengende websider i Frontpage 2003 Laget av Magnus Nohr Høgskolen i Østfold Innholdsfortegnelse 1 Opprett Web-område 3 2 Opprett en navigasjonsstruktur
Følgende «tommelfinger-regler» bør (må) følges:
Notat Denne «oppskriften» er basert på erfaringer om hva som går bra når en benytter Word til å lage navigasjonsdiagrammer. Det finnes sikkert andre måter som også gir et brukbart resultat. Det er bare
CSS. Animasjon med css. Animasjon med. Informasjonsteknologi 1 og 2. Gløer Olav Langslet Sandvika VGS
Animasjon med CSS Gløer Olav Langslet Sandvika VGS Leksjon 11 Informasjonsteknologi 1 og 2 Animasjon med css Vi har tidligere sett at vi kan programmere bevegelse ved å bruke JavaScript, enten ved å bruke
Bygge en kube. Introduksjon. Steg 1: Lage en ny mod. Skrevet av: Pål G. Solheim
Bygge en kube Skrevet av: Pål G. Solheim Kurs: Learntomod Tema: Blokkbasert, Minecraft Fag: Programmering, Teknologi Klassetrinn: 1.-4. klasse, 5.-7. klasse, 8.-10. klasse Introduksjon Vi skal bygge en
Communicate SymWriter: R4. Bruke handlinger
Communicate SymWriter: R4. Bruke handlinger Du har allerede sett Rediger cellehandlinger dialogen i bruk. Denne delen gir en oversikt over de handlingene som er tilgjengelige. Innhold R4.1 Grunnleggende
Hurtigreferanse for HP Photo Printing
Hente bilder til fotogalleriet Bruk en av disse metodene til å legge til bilder i fotogalleriet. Fotogalleriet er den venstre ruten i HP Photo Printing-programvaren, og er utgangspunktet for å lage utskrifter
GoOnline Site Search
GoOnline Site Search Beskrivelse Innhold 1. Generelt a. Informasjon om dette dokumentet b. Versjon 2. Indeksering 3. Søk a. Indeksering av produkt b. Indeksering av ordinær side c. Indeksering mot 3.parts
Hvordan hente ut listen over et hagelags medlemmer fra Hageselskapets nye portal
Hvordan hente ut listen over et hagelags medlemmer fra Hageselskapets nye portal Av Ole Petter Vik, Asker Versjon 2.3 20.03.2012 Beskrivelsene for hvert enkelt skritt er over hvert skjermbilde. Via Hageselskapets
BRUKERVEILEDNING TIL MAGNORMOEN INDUSTRIOMRÅDE OG GAUSTADVEGEN INDUSTRIOMRÅDES HJEMMESIDER:
BRUKERVEILEDNING TIL MAGNORMOEN INDUSTRIOMRÅDE OG GAUSTADVEGEN INDUSTRIOMRÅDES HJEMMESIDER: http://www.magnormoen.no/ og http://www.gaustadvegen.no/ Utarbeidet av Solveig Hem Sørli og Arne Sørli Side 1
Kom i gang med Zotero: En enkel veiledning
Kom i gang med Zotero: En enkel veiledning Zotero er et gratis referanseverktøy for Windows og Mac. Du samler kildene fra nettsider og databaser og kan bruke de samme referansene i Word når du skriver.
Verdens korteste grunnkurs i Excel (2007-versjonen)
Verdens korteste grunnkurs i Excel (2007-versjonen) NB! Vær oppmerksom på at Excel kan se annerledes ut hos dere enn det gjør på bildene under. Her er det tatt utgangspunkt i programvaren fra 2007, mens
SUKKERGRIS. 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
Brukermanual For app.minmemoria.no
Brukermanual For app.minmemoria.no For videomanual: søk etter MinMemoria App på www.youtube.com Velkommen! Memoria er en digital minnebok og en plattform for sosial kommunikasjon mellom familier, helsepersonell
Nettside24 Brukerveiledning Nettside24 Brukerveiledning
Nettside24 Brukerveiledning Nettside24 Brukerveiledning 1 av 14 Oversikt over brukerveiledningen. 2. Oversikt. 3. Logge inn på nettsiden. 4. Redigere innholdet på undersidene. 5. Redigere innholdet i blokkene.
Lage klubbens webside i Rotary med verktøyet Webwiz 2.0
Lage klubbens webside i Rotary med verktøyet Webwiz 2.0 Versjon 1.0 av DICO 2250 25.04.2011 Det å lage en webside uten å ha kjennskap til dette fra før, kan virke vanskelig, men ikke fortvil. Det går alltid
Videoredigering med VideoPad
Videoredigering med VideoPad I kapittel 13 i læreboka beskriver vi enkel videoredigering. I denne oppskriften skal vi se på hvordan vi kan redigere videofiler i VideoPad. Vi kommer til å bruke videofilen