Søk i Webskolen:

Globale linker

• Linker
• Oppgaver

CSS

• Intro
• Dokumenttre
• Syntax
• Sette inn
• Font
• Text
• Box
• Background
• Classification
• Posisjonering
• CSS-hacks
• Quick guide
• Gode råd

CSS quick guide

Klikk på egenskapene for å vise/skjule forklarende tekst.

Se W3Cs sider for fullstendig oversikt over alle muligheter du har med CSS.

Background

Background Et samle begrep for bakgrunns-definisjoner. Angis i rekkefølgen
color image repeat attachment position
Background-color bakgrunnsfarge i hexadecimal verdi
Background-image bakgrunnsbildets adresse. Må skrives som:
background-image: url (bilde.gif)
Background-repeat: om bakgrunnsbildet skal gjentas. Mulige verdier er:
no-repeat, repeat-x og repeat-y
Background-position Angir hvor bakgrunnsbildet skal plasseres. Mulige verdier:
top, center, bottom, left, right
Background-attachment Angir om bakgrunnsbildet skal scrolle med resten av siden eller ikke.
Mulige verdier: fixed, scroll

Border

Border Samlebetegnlese for kantstrek, angis i rekkefølgen:
width style type
Border-width Angir tykkelsen på kantstreken.
Mulige verdier: thin, medium, thick, eller en numerisk verdi angitt med måleenhet: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point)
Border-style Angir type kantstrek. Mulige verdier:
none, dotted, dashed, solid, double, groove, ridge, outset
Border-color Angir farven på kanstreken i hexadecimale verdier.
Border-top Samlebetegnlese for øvre kantstrek, angis i rekkefølgen:
width style type
Border-top-width Angir tykkelsen på øvre kantstrek.
Mulige verdier: thin, medium, thick, eller en numerisk verdi angitt med måleenhet: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point)
Border-top-style Angir type for øvre kantstrek. Mulige verdier:
none, dotted, dashed, solid, double, groove, ridge, outset
Border-top-color Angir farven på øvre kanstrek i hexadecimale verdier.
Border-right Samlebetegnlese for høyre kantstrek, angis i rekkefølgen:
width style type
Border-right-width Angir tykkelsen på høyre kantstrek.
Mulige verdier: thin, medium, thick, eller en numerisk verdi angitt med måleenhet: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point)
Border-right-style Angir type for høyre kantstrek. Mulige verdier:
none, dotted, dashed, solid, double, groove, ridge, outset
Border-right-color Angir farven på høyre kanstrek i hexadecimale verdier.
Border-bottom Samlebetegnlese for nedre kantstrek, angis i rekkefølgen:
width style type
Border-bottom-width Angir tykkelsen på nedre kantstrek.
Mulige verdier: thin, medium, thick, eller en numerisk verdi angitt med måleenhet: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point)
Border-bottom-style Angir type for nedre kantstrek. Mulige verdier:
none, dotted, dashed, solid, double, groove, ridge, outset
Border-bottom-color Angir farven på nedre kanstrek i hexadecimale verdier.
Border-left Samlebetegnlese for venstre kantstrek, angis i rekkefølgen:
width style type
Border-left-width Angir tykkelsen på venstre kantstrek.
Mulige verdier: thin, medium, thick, eller en numerisk verdi angitt med måleenhet: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point)
Border-left-style Angir type for venstre kantstrek. Mulige verdier:
none, dotted, dashed, solid, double, groove, ridge, outset
Border-left-color Angir farven på venstre kanstrek i hexadecimale verdier.

Plassering og størrelse

Clear Flytter elementer som flyter til siden nedenfor elementet. Virker på samme måte som «CLEAR»-atributtet til <BR>-taggen
Mulige verdier: left, right, both, none
Display Brukes til å definere hvordan et element skal vises.
Mulige verdier: block, inline, list-item, none
Float Muliggjør flyt av tekst rundt elementer, som «ALIGN»-atributtet til <IMG>-taggen.
Mulige verdier: left, right, none
Width Angir bredden til et element.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Max-width Angir maksimumsbredden til et element.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Min-width Angir minimumsbredden til et element.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Height Angir høyden til et element.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Max-height Angir maximumshøyden til et element.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Min-height Angir minimumshøyden til et element.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)

Position Angir hvordan elementet skal plasseres.
Mulige verdier: absolute, relative, static, fixed
Left Angir avstanden fra venstre kant.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Top Angir avstand fra toppen.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Right Angir avstand fra høyre kant.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Bottom Angir avstand fra bunnen.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Clip Angir hvilken del av et element som er synlig. Angis med avstand fra øverste venstre kant i elementet (clip: rect(5px 5px 5px 5px))
Visibility Angir om elementet skal være synlig eller ikke.
Mulige verdier: visible, hidden, collapse
Overflow Angir hva som skal skje dersom innholdet (tekst, bilde, etc...) i elementet er større enn det som kan vises innenfor elementets bredde og høyde.
Mulige verdier: visible, hidden, scroll, auto
Cursor Angir om musepekeren skal forandres til noe annet når den er over elementet
Mulige verdier: auto, crosshair, default, pointer, move, e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize, text, wait, help

Lister

Disse stildefinisjonene gjelder for <ul>, <ol> og elementer med definert med - display: list-item

List-style Kortversjon av de tre nedenstående. Angis i rekkefølgen:
type position image
List-style-image Angir hvilket bilde som skal brukes som punktbilde. Erstatter punktgrafikken som er spesifisert med list-style-type.
list-style-image: url(bilde.gif)
List-style-position Angir om punktgrafikken skal ligge innenfor eller utenfor liste-elementet.
Mulige verdier: inside, outside
List-style-type Angir hva slags type punktgrafikk som skal brukes for hvert listeelement.
Mulige verdier: disc, circle, square, lower-roman, upper-roman, lower-alpha, upper-alpha, none

Marger

Margin kortversjon av de fire nedenstående. Angis i rekkefølgen:
top right bottom left
Margin-top Angir toppmarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Margin-right Angir høyremarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Margin-bottom Angir bunnmarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Margin-left Angir venstremarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)

Padding - eller «indre marg». Avstand fra kantlinje til elementets innhold. Dette er kortversjonen for de fire nedenstående. Angis i rekkefølgen:
top right bottom left
Padding-top Angir indre toppmarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Padding-right Angir indre høyremarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Padding-bottom Angir indre bunnmarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Padding-left Angir indre venstremarg for elementet.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)

Skrift

Color Angir skriftfarve i hex-verdi
Font Kortversjon for font-definisjoner. Angis i rekkefølgen:
font-style font-variant font-weight font-size line-height font-family
Font-family Angir hva slags font som skal brukes. Angi flere ved å adskille med komma.
Font-size Angir skriftstørrelse (høyde)
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Font-style Angir skrift-stil. Mulige verdier:
normal, italic, oblique
Font-variant Angir om teksten skal vise normal eller med små store bokstaver. Mulige verdier:
normal, small-caps
Font-weight Angir tykkelse på teksten. Mulige verdier:
normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900
Letter-spacing Angir avstand mellom bokstaver/tegn.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Word-spacing Angir avstand mellom ord.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Line-height Angir linjeavstand.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Text-align Angir horisontal tekstjustering. Mulige verdier:
left, center, right, justify
Text-decoration Angir om tekst skal ha pynt eller ikke. Mulige verdier:
none, underline, overline, line-through, blink
Text-indent Angir innrykk for første linje i et avsnitt.
Mulige verdier: em (ems), ex (x-height), px (pixler), cm (centimeter), mm (millimeter), pc (pica), in (inch), pt (point) eller % (prosent)
Text-transform Angir om tekst skal være i store eller små bokstaver. Mulige verdier:
none, capitalize, uppercase, lowercase
Vertical-align Angir om tekst skal heves eller senkes i forhold til baseline. Brukes til f.eks H2O. Mulige verdier:
baseline, sub, super, top, text-top, middle, bottom, text-bottom, prosent
White-space Angir hvordan «white space» skal behandles. Mulige verdier:
normal, pre, nowrap