Lav trekanter med CSS

Det er faktisk muligt at lave trekanter ved hjælp af CSS. Det er ret simpelt, det eneste der skal bruges er border attributten og et div element uden hverken højde eller bredde.

Læs mere

Hvordan laver man de 3D bannere?

En lille trend blandt diverse websites for tiden er bannere med dybde, nærmest en slags 3D bannere. De er faktisk nemme at lave og den her artikel vil der blive vist hvordan de laves fra photoshop til den endelige CSS/HTML.

Læs mere

Et lille kig på transition effekter

Endnu en ny feature ved CSS3 er transition. Med den er det muligt at synlig gøre overgangen i ændringerne på sine elementer, f.eks. hvis man flytter et element fra X til Y, så vil man se elementet bevæge sig istedet for blot at hoppe i et ryk.

Det giver mulighed for at lave interessante effekter, og her er to, en rullende film og en scrollende baggrund vha. af flere baggrunde.

Læs mere

Text-overflow – Afkort tekster med CSS

At beregne længden på variable tekster og derefter afkorte dem så der er plads til dem, kan være en langhåret proces med f.eks. javascript. Med CSS’s text-overflow bliver det næppe nemmere! Den afkorter teksten med 3 punktumer…inden teksten begynder at bryde.

Det er endnu ikke en del af CSS3 standarden, men den er understøttet af blandt andet IE7+, Chrome og Safari. Lad os tage et kig på den her!

Læs mere

Lav skygger med CSS3’s text-shadow og box-shadow

CSS3 kommer med en lang række fancy ting som gør livet lidt nemmere for webdesigneren, det er f.eks. slut (ah næsten) med at bruge himmel dyre tegneprogrammer, en masse ekstra baggrundsbillede samt tilføje en masse ikke-semantisk HTML for at lave smarte skygge effekter på sine tekster og andre ting.

Med text-shadow og box-shadow er det nemlig muligt at lave skygger til ens HTML elementer, og lad os tage et smugkig på dem nu.

Læs mere