Mini-påskeLAN med Kodeklubben!
mar18

Mini-påskeLAN med Kodeklubben!

...

Les mer
HTML-kurs del 2
feb12

HTML-kurs del 2

Del 2 i det litt populære kurset er her. Hittil har vi hatt simple sider – svart på hvitt. Det kan vi gjøre noe med. Aller best er CSS, vi ser på det i del 3. Her i del 2 får du ett helt lager med CSS-funksjoner. Bruk gjerne det som oppslagsbok. Gled dere! ..og nyt livet (mens du ennå har det). Om kurset Dette er del 2 av ett HTML kurs på 4 deler totalt, hvor vi gradvis får mer avanserte koder. De fire delene er som følger: HTML kurs del 1: Basisen, Prinsippet, Tekst og It’s Learning-metoden. HTML kurs del 2: Farger, design og (eksterne) lenker. HTML kurs del 3: Ny kodingsart; CSS; som brukes til design. HTML kurs del 4: Mer CSS og HTML, standard-side, og mye mer. Det er også en FAQ: HTML kurs FAQ Håper du nyter den! NB! Kurset er ikke ferdig ennå! Relativ og absolutt Relativ og absolutt er to utrykk du kan lære deg først som sist. La oss ta for oss disse nå. La oss si at vi har ett mappesystem som er slik: /root /html /php /test som betyr at hovedmappen er root, og inni den ligger html, php og test. Hva hvis vi er inne på nettsida index.html som ligger i html mappen, og vi skal ha tak i en ting i mappen test, må vi først en mappe opp, også inn i test; ../test/bilde.jpg hvor ../ betyr en mappe opp, test er mappen og bilde.jpg er filen. Dette er relativt – vi er allerede inni index.html, og går videre til bilde.jpg. Men absolutt betyr uannsett. La oss bruke det samme eksemplet: /root/test/bilde.jpg Vi markerer først at dette er absolutt – ved å starte med en /. Deretter oppgir vi hele veien. Hvis domenet vårt hadde hett www.minside.no, ville man startet helt på begynnelsen – hele URLen hadde blitt http://www.minside.no/root/test/bilde.jpg Men det ville ikke vært nødvendig å skrive alt; /root/test/bilde.jpg Husk å angi filetternavnet også! (.html, .jpg osv…) Oppsumering: Relativt er itillegg til noe, og absolutt er absolutt – helt fra begynnelsen av. Lenker Lenker..? Dette kalles også links. Men hva er så links? http://www.vg.no er en link – grunnet at det tilvanlig er blått, og at du , de fleste ganger, havner et annet sted når du trykker. Det er jo lurt med slike ting? I kode 9.0 vil vi ta for oss en link – åpne hist.html (kode 7.1)(HTML kurs del 1), og se til at når du lagrer ser det ut som Kode 9.0. Kode 9.0 <head> <title>Historien om Ole Jakob</title> </head> <body> <h1><center>Historien om Ole Jakob</center></h1> <p><b>Ole JAkob gikk i klasse 6A.</b><br> B-klassingene ertet...

Les mer
HTML-kurs FAQ
feb12

HTML-kurs FAQ

Del 2 i det litt populære kurset er her. Hittil har vi hatt simple sider – svart på hvitt. Det kan vi gjøre noe med. Aller best er CSS, vi ser på det i del 3. Her i del 2 får du ett helt lager med CSS-funksjoner. Bruk gjerne det som oppslagsbok. Gled dere! ..og nyt livet (mens du ennå har det). Om kurset Dette er del 2 av ett HTML kurs på 4 deler totalt, hvor vi gradvis får mer avanserte koder. De fire delene er som følger: HTML kurs del 1: Basisen, Prinsippet, Tekst og It’s Learning-metoden. HTML kurs del 2: Farger, design og (eksterne) lenker. HTML kurs del 3: Ny kodingsart; CSS; som brukes til design. HTML kurs del 4: Mer CSS og HTML, standard-side, og mye mer. Det er også en FAQ: HTML kurs FAQ Håper du nyter den! NB! Kurset er ikke ferdig ennå! Relativ og absolutt Relativ og absolutt er to utrykk du kan lære deg først som sist. La oss ta for oss disse nå. La oss si at vi har ett mappesystem som er slik: /root /html /php /test som betyr at hovedmappen er root, og inni den ligger html, php og test. Hva hvis vi er inne på nettsida index.html som ligger i html mappen, og vi skal ha tak i en ting i mappen test, må vi først en mappe opp, også inn i test; ../test/bilde.jpg hvor ../ betyr en mappe opp, test er mappen og bilde.jpg er filen. Dette er relativt – vi er allerede inni index.html, og går videre til bilde.jpg. Men absolutt betyr uannsett. La oss bruke det samme eksemplet: /root/test/bilde.jpg Vi markerer først at dette er absolutt – ved å starte med en /. Deretter oppgir vi hele veien. Hvis domenet vårt hadde hett www.minside.no, ville man startet helt på begynnelsen – hele URLen hadde blitt http://www.minside.no/root/test/bilde.jpg Men det ville ikke vært nødvendig å skrive alt; /root/test/bilde.jpg Husk å angi filetternavnet også! (.html, .jpg osv…) Oppsumering: Relativt er itillegg til noe, og absolutt er absolutt – helt fra begynnelsen av. Lenker Lenker..? Dette kalles også links. Men hva er så links? http://www.vg.no er en link – grunnet at det tilvanlig er blått, og at du , de fleste ganger, havner et annet sted når du trykker. Det er jo lurt med slike ting? I kode 9.0 vil vi ta for oss en link – åpne hist.html (kode 7.1)(HTML kurs del 1), og se til at når du lagrer ser det ut som Kode 9.0. Kode 9.0 <head> <title>Historien om Ole Jakob</title> </head> <body> <h1><center>Historien om Ole Jakob</center></h1> <p><b>Ole JAkob gikk i klasse 6A.</b><br> B-klassingene ertet...

Les mer
HTML-kurs: CSS
feb12

HTML-kurs: CSS

Cascading Style Sheet, eller CSS, er et eget programmerings-språk som er et suplement til HTML. Ved hjelp av CSS kan man definere farger, posisjon, størrelse, og mye mer. Poenget er å ha all denne informasjonen samlet et sted – slik at hvis man forandrer den ene filen, vil dette gjelde for de andre filene (Cascading). Å lagre en egen .css fil For å lagre en fil som CSS-fil, må den ha fil-etternavnet .css . Den kan dermed refereres til i HTML slik: <html> <head> <!-- META-tagger, JavaScript og Title-tagg --> <link rel="stylesheet" href="filen.css" type="text/css"> </head> <body> <!-- All hoved-kodingen går her --> </body> </html> media-atributten En virkelig kul mulighet med link-taggen er at man kan bruke media atributten: <link rel="stylesheet" href="filen_skjerm.css" type="text/css" '''media="screen"'''> <link rel="stylesheet" href="filen_print.css" type="text/css" '''media="print"'''> Når du ser dokumentet på vanlig måte på skjermen, er det filen_skjerm.css som blir brukt. Når du skriver det ut, eller bruker utskrifts-forhåndsvisning, er det filen_print.css som blir brukt. På denne måten kan du lage utskriftsvennlige versjoner. Syntaks DOM-element { stil-element: verdi; [...]; } DOM-element  Hva CSSen som er mellom { og } skal gjelde for – kan være en HTML-tagg som <p> eller en class, eller en id. stil-element  Hva verdien gjelder for. Kan f. eks. være background-color for å angi at verdien skal være bakgrunnsfargen. verdi  I eksemplet ovenfor, er verdien bakgrunns-fargen som gjelder for DOM-elementet. Eksempel <!-- stil.html --> <html> <head> <title>Eksempel på bruk av CSS</title> <link rel="stylesheet" href="stilen.css" type="text/css" media="screen"> </head> <body> <h1 class="eksempel_klasse">Dette er et eksempel på bruk av CSS</h1> <p id="eksempel_id"> ...og dette er noe tekst. </p> <hr> <div id="eksempel_id"> ...enda litt mer testing... </div> <h1>Dette er en normal overskrift</h1> <p> ...og dette er normal tekst! </p> </body> </html> /* stilen.css */ #eksempel_id { background-color: yellow; color: red; } h1.eksempel_klasse { background-color: #000011; } h1 { color: gold; } p { color: #000000; } Eksemplet ovenfor demonstrerer bruken av CSS på tagger, classes og id’er. CSS-stilelementer I HTML kurs del 2 vil det som står nedenfor bli gjennomgått, men her kan du slå opp og se eksempler. Nedenfor ser du malen som brukes: [rediger]stil-element Her står det en beskrivelse av stil-elementet. Her står det hva den tilhørende verdien kan være. Her står det et eksempel på CSS som også blir forklart. Og tilslutt kommer det en liste hvor det stilelementet du nettopp leste om er uthevet. Farger og bakgrunn [rediger]color Angir tekstens farge. Det er ganske lurt å angi en farge som er lett leselig – du så i eksemplet (Kode 11.0)at WUHU var nesten uleselig. Vanlige farge-koder – se her for detaljert skjema. p { color: yellow; background-color: black; } vil gjøre om alle...

Les mer
HTML-kurs del 1
feb12

HTML-kurs del 1

Med HTML (Hyper Text Markup Langue) kan du kode dine egne hjemmesider. Jeg skal prøve å forklare deg hvordan. Med HTML har du mer kontroll, og hvis du skal offentlig-gjøre din side, er dette meget lett. Ja, så hva er kostnadene? Vel, HTML er gratis å bruke, men det koster hvis du skal ha ett host. Men ved å bruke It’s Learning er det problemet løst. Dette er del 1 i det fire deler lange kurset. HTML kurs del 1: Prinsippet i koding, dine første scripts HTML kurs del 2: Mer HTML, om CSS HTML kurs del 3: Mer CSS, litt mer HTML HTML kurs del 4: FAQ Om du ikke skulle få det til, anbefales du til å gå innom FAQen: Unnskyld meg, hva er HTML? HTML er basisen i hjemmeside-koding. Det er faktisk ikke så vanskelig som du kunne tro, og faktisk ikke så dyrt som du skulle frykte. Hvis du skal lage virkelig store sider, er ikke HTML nok – men du er nødt til å lære HTML for å kunne lære deg noen andre kodingsarter. I dette kurset vil du kunne lære: Å lage hjemmesider hvordan designe sider hvordan lage pene sider Men hvorfor bruke HTML, når vi har gode, greie Piczo? Trenger du grunner, eller; Piczo er ikke så populært blant folk. Med HTML har du mer kontroll. Du kan skryte av at du kan lage sider uten Piczo. Ingen reklame Intet rart Piczo-system Dette kurset er lagt opp til at Piczo brukere lett kan skifte over til HTML,, og at nye kan lære det seg like lett. Alt du trenger er motivasjon – og en Datamaskin. (Det mangler fortsatt en del om Piczo folkens, bare vent og ta det med ro… Prinsippet For å kunne skrive inn HTML koder, må du åpne notisblokk ved å trykke START > Programmer > Tilbehør > Notisblokk. Eller du kan åpne Mine dokumenter, høyreklikke, Ny, Nytt tekstdokument. (Forutsatt at du bruker Windows. Hvis du bruker Ubuntu, Linux: Programmer > Tilbehør > Tekstredigering) Koder – eller såkalte «tags» i HTML er inni <>, og de fleste taggs må avsluttes med ett </>. F. eks: <html>BLABLABLA</html> Husk at hver kode (fil) her starter med <HTML> og slutter med </HTML>. Disse er ikke tatt med, det kan være god trening. Åpne Notisblokken, og tast inn kode 1.0 Kode 3.0 <body> Dette er en test </body> Du ser at vi starter koden <body>, og putter innhold immelom start koden og sluttkoden(</body>) I dette tilfellet, litt tekst. Deretter avslutter vi koden <body> med </body>. Husk at FØR <body> må vi ha <HTML>, og etter, på slutten, må vi ha </HTML>. Lagre notisblokken –...

Les mer

Kodeklubben samles igjen

Velkommen til kodekveld på Riddersand skole torsdag 15. januar fra kl. 17:30-19:30. Det blir noe for alle denne torsdagen! Vi har ingen påmelding denne gangen – det er bare å møte opp 🙂 Det blir to workshops: Vi har en dataworkshop der du får se hvordan en datamaskin ser ut inni og lære om forskjellige datakomponenter. Passer for alle interesserte! Det blir også en Code Academy-workshop der du lærer andre programmeringsspråk enn Scratch og Kodu. Passer for elever fra 5. trinn og oppover. Du kan også komme for å programmere et spill i Scratch, Kodu eller prøve deg på Computercraft (må forhåndsinstalleres) hvis du vil det. Vi har oppgaver til alle, fra nybegynner til den mest drevne. Vi har PC`er til utlån dersom du trenger å låne PC. Hilsen Fet Kodeklubb og mange frivillige foreldre! Bli venn med Fet Kodeklubb på Facebook for...

Les mer
Start chat
1
Close chat
Hei! Takk for at du besøker oss! Trykk på knappen under for å starte en chat.

Start chat