Vi ringer deg
Hvordan blir jeg medlem på QXL.no?
 
 
 

HTML

 

HTML brukes av nettlesere for å beskrive hvordan siden skal se ut.

 

  HTML står for Hyper Text Markup Language. Det er ved hjelp av html man forteller nettleseren hvordan den skal vise innholdet på siden, ved hjelp av forhåndsdefinerte "tagger". Vi har åpnet opp for at du kan benytte html i auksjonsbeskrivelsen din, dog med noen begrensninger. Vi har valgt å utelukke "tagger" som kan virke forstyrrende/ødeleggende på sidens oppbygging og funksjonalitet. De "tagger" du kan benytte er følgende:  
 
 
Tagg Beskrivelse Eksempel på bruk
<table> Tagg for å definere en tabell, Må ha minst en rad (<tr>) og en kolonne (<td>). <table><tr><td>Tekst eller innhold</td></tr></table>
<colspan> Tagg for å slå sammen tabellruter horisontalt <table><tr><td colspan="2" >Tekst eller innhold</td></tr><tr><td>Tekst eller innhold<td>Tekst eller innhold</td></tr></table>
<rowspan> Tagg for å slå sammen tabellruter vertikalt <table><tr><td rowspan="2" >Tekst eller innhold</td><td>Tekst eller innhold</tr><td>Tekst eller innhold</td></tr></table>
<style> Tagg for å bestemme utseende på tabell elle tekst <td style="stil1; stil2;"></style>
<img> Tagg for å legge inn bilde <img src="http://mittdomene/mittbilde.jpg"/>
<ol> Tagg for å lage en punktvis liste, enten nummerert (<ol>) eller unummeret (<ul>)

<ol><li>punkt nr. 1</li> <li>punkt nr. 2 </li> </ol>

<hr> Tagg for å lage en horisontal linje <hr></hr>
<p> Tagg for å lage et avsnitt <p>Avsnitt med tekst</p>
<strong> Tagg for å lage fet skrift. <b> kan også brukes til dette <strong>Uthevet tekst</strong>
<i> Tagg for å lage kursiv tekst <i>Kursiv tekst</i>
<u> Tagg for å lage strek under teksten <u>understreket tekst</u>
<font> Tagg for å bestemme utseende på tekst <p style="font-size:18px; font-color:#999999;">Tekst her</p>
<span> Tagg som f.eks. kan brukes til å definere en annen stil på en utvalgt del av et avsnitt. <p>tekst med annen størrelse på ordet <span style="font-size 18px;">anderledes</span></p>
<align> Tagg som kan brukes til å midtstille (<centre>) eller sidestille (<left>, <right>) tekst og innhold horisontalt. <td align="left">Venstrestilt tekst </td>
<valign> Tagg som kan brukes til å midtstille (<middle>) eller sidestille (<top>, <bottom>) tekst og innhold vertikalt. <td valign="top">Toppstilt tekst </td>
<padding> Tagg som kan brukes til å bestemme avstand fra kant(er) innenfor en tabellrute. <td style="padding-left:12px; ">Tekst</td>
<object> Tagg som kan brukes til å implementere video eller flash i beskrivelsen <object type=”application/x-shockwave-flash” data=”URL TIL DIN VIDEO HER” height=”385″ width=”640″><param name=”movie” value=”URL TIL DIN VIDEO HER“></param><param name=”allowFullScreen” value=”true”></param></param></object>
 
 

 
 

Enkel innføring i bruk av HTML:

 
 
 Tabeller
En enkel og sikker måte å benytte html kode i dine auksjoner på, er å bruke tabeller. Da kan du med enkle grep organisere innholdet slik du selv måtte ønske det. Jeg vil her gå gjennom de mest vanlige måtene å sette opp en tabell på. Alle metodene er illustrert i kolonnen til høyre på siden. Se fargekodene for å se hva som hører sammen.
 
 
 
1. Enkel tabell med to kolonner: Dette er en veldig enkel form for tabell, hvor du kan skrive innhold i 2 forskjellige “ruter” på siden. Du kan for eksempel ha tekst i den en, og bilde i den andre. Som du ser av eksempelet, så må hvert element ha en start og en slutt tag. <table> indikerer selve rammen, og blir avsluttet med </table>. <tr> indikerer ny rad i tabellen, og avsluttes med </tr>. <td> inikerer kolonne, og avsluttes med </td>  
2. Enkel tabell med to kolonner og to rader: Denne er veldig lik den forrige, men med fire “ruter” i stedet for to, fordelt på to linjer.  
3. Colspan: Denne er litt mer avansert enn de to forrige. Her har du 3 “ruter” fordelt på to rader. For å få til dette, må du bruke colspan. I eksempelet til høyre har jeg skrevet colspan=”2″ – Det vil si at jeg ber den nederste “ruten” om å strekke seg over 2 kolonner.  
4. Rowspan: Nesten det samme som colspan, men her ber jeg den venstre “ruten” om å strekke seg over to rader. Koden er rowspan=”2″  
5. Nestet tabell: Man kan også sette inn nye tabeller i en “rute” om man ønsker det. Bare husk at all koden fra den nye tabellen må være innenfor “rutens” tab (mellom <td> og </td> i den aktuelle ruten) så her må du ha tungen rett i munnen.  
6. Bilde: Man kan sette inn bilde i hvilken som helst av “rutene”. Til høyre har jeg vist hvordan man setter inn et bilde i en rowspan-tabell (jfr. pkt. 4). Koden for å sette inn et bilde er <img src=”DITTBILDE”> – Bytt ut DITTBILDE med url adressen til bildet ditt. Obs. Bildet må ligge på en webserver, ikke lokalt på din maskin. Du kan for eksempel først last opp bildet til imageshack.us som er en gratis tilbyder av bildelagring.  
 
Style
For å detaljstyre enda mer hvordan beskrivelsen skal se ut, kan du benytte deg av style. Alle elementene kan inneholde style-kode. De mest brukte style kodene er:
 
1. Background: I bakgrunnen kan du ha enten bilde eller farge. Du kan ha forskjellig bakgrunn på bakgrunnen og på “rutene”. Hvis du for eksempel vil ha bakgrunnsfarge sort på hele tabellen, Hvit tekst i den enne “ruten” og et bakgrunnsbilde på andre ruten, kan du skrive følgende kode (Med utgangspunkt i enkel tabell med to kolonner):
<table width=”244″ style=”background-color:#000000; “> <tr><td width=”122″ height=”95″ style=”color:#FFFFFF; “>Flott PC til salgs</td><td width=”122″ height=”95″ style=” background-image:”DITTBILDE”; background-repeat:no-repeat;”>&nbsp;</td></tr></table> – Merk at det også er satt inn en kode background-repeat=no-repeat; – dette er for at bakgrunnsbildet kun skal vises en gang.
 
2. Padding, align og valign: I eksempelet over er teksten satt midt i “ruten”, helt inntil venstre kant. Du kan bestemme hvor i ruten teksten skal stå ved å bruke koden align og valign. align=”left” vil sette teksten til venstre i ruten, og valign=”top” vil sette teksten øverst i ruten. Om du ønsker å ha mer kontroll over hvor teksen blir plassert i ruten, kan du benytte Padding (innenfor style området). Det er fem ulike koder for dette; padding, padding-top, padding-bottom, padding-left og padding-right. Om du kun skriver padding=10px; vil teksten holde minst en avstand på 10 pixler til alle kanter.  
 
OBS!
Bredden på beskrivelsen din må ikke overstige 960 pixler. Bruk heller prosent enn faktiske pixler, da vil den automatisk justere seg. (Width="100%" vil fylle hele bredden).