NemProgrammering.dk logo
3 måneders gratis webhotel til alle NemProgrammering.dk brugere! Få din UnoEuro Rabatkode her
UnoEuro rabatkode

CSS3 gradienter - lineær og radiale

CSS3 kursus | Lær at anvende CSS3
WordPress hjemmeside hjælp

Information om denne video

Underviser: Rene Gundersen, www.gundersen-it.dk

I denne video viser vi, hvordan CSS3 kan bruges til at lave farve gradienter med. Mere specifikt så kigger vi på radiale og lineare gradienter. Disse gradienter vil blive påført som baggrund på en div, hvilket du vil kunne se i videoen. Til dem som er i tvivl, så er en gradient defineret således (w3.org):

"En graduering eller gradient er et browser-genereret billede specificeret udelukkende i CSS(3). Disse er billeder som består af bløde overgange mellem flere farver (farveovergange). Der er to grundlæggende typer af gradienter i øjeblikket. Disse er: lineære og radiale gradienter. Disse er specificeret af den lineære-gradient() og radial-gradient() funktion, og kan bruges alle de steder hvor man før kunne bruge billeder som baggrund.(oversat fra engelsk)"

Det smarte er altså, at du nu udelukkende ved hjælp af CSS kan lave baggrunde der skifter farve på langs, på tværs eller diagonalt alt efter hvordan du vælger at sætte det hele op.

Herunder finder du koderne der bliver lavet i videoen - Kopier dem gerne!
Du kan hente alle kildefilerne her: Kildefiler til farveovergange

Video tags:

Denne video relaterer til emner såsom: CSS3 kursus, CSS3 guide, Gratis CSS3 undervisning, CSS3 video tutorials på dansk, CSS3 introduktion, muligheder med CSS3, gradienter, radiale, lineare, baggrundsfarver, farveovergang

Spørgsmål og kommentarer

Har du spørgsmål eller kommentarer? Så skriv herunder! Alternativt kan du kontakte os på vores forum, hvor en masse hjælpsomme personer sidder klar ved tasterne.

Url´er bliver automatisk omdannet til links (nofollow).

kommentar på NemProgrammering.dk - lav din egen hjemmeside
gitte    18-09-2015

jeres videoer er gode men disse om css er lyden ikke god og meget lav


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Thomas     09-08-2014

Hej Naja, Det er udelukkende for undervisnings skyld, så man nemmere kan få overblikket over både HTML og CSS. Vi anbefaler selvfølgelig altid at CSS lave i en separat CSS fil som så inkluderes på dine sider.


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Naja    09-08-2014

Tak for nogle gode tutorials! I tidligere CSS videoer har I oprettet stylesheets i CSS, men nu styles der direkte i html-header. Er der nogen bestemt årsag til dette eller er det blot for lethedens skyld?


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Mads Haupt    09-09-2012

Jeg kunne godt tænke mig at ændre højden på linear gradient men jeg hvid ikke hvordan men gøer. er der ikke der kand hjelpe mag?