Såhär funkar rgba i CSS 3

Layout, hel designen och färgtemat till Sannak.se börjar ta sin slutgiltiga form. Nu har jag kreativa idéer som mina CSS kunskaper inte hänger med på. Planen är att den långa listan här till vänster, ska bli lite lättare att överblicka, för att lättare kunna hitta blogginlägg om de ämne man intresserar sig i. Stuga och Trädgård, Foto, Design & Formgivning, Events, MIN KOBOK och Ekotips.

background: #bada55 / rgba (186, 218, 56,1);

Alla kategorier ska få sitt eget utseende, men i vilken form?

Jag tänkte att jag kan ge alla en rgba bakgrundfärg, men jag vet inte hur jag ska gå tillväga. Men jag tycker om att berätta om mina idéer, de är också bra för att komma ihåg dom.
Rgba är skitnice, jag ska visa dig hur snyggt de blir när man lär sig hantera det!
Det är vad jag använt när för att få den snygga genomskinligheten i min site-title, som säger En hyfsat modern hippie i min header. Sen kan man gå in på spans för att ge de alla orden en helt egen alpha, men de kan vi ta nån annan gång!
Jag brukar använda #bada55 som exempelfärg, för den är ju så badass..

Använder du dig av hex så blir ditt resultat såhär;
Resultat av hexkod.

Använder du dig av rgba, så kan ditt resultat bli såhär;
Resultat i rgba, alpha 0.4. Med text-shadow

Samma värden men utan text-shadow;
Resultat i rgba, alpha 0.4.

Frågor?

Red – Första siffran avgör hur mycket rött de ska in i färgen
Green – Andra siffran avgör hur mycket grönt som ska in i färgen
Blue – … You get the picture..
Alphan – Avgör opacity, dvs hur pass transparent den ska vara. Skriver du 1, så är den heltäckande.
Sen kan du gå ner enda till 0.1

Skulle du inte lyckas klura ut varifrån du hittar färg, så hämtar jag från photoshop.
Jag har många hexkoder i huvudet jag använt mig mycket av och nu håller jag på och matar in rgba sifforna i huvudet stället.

Leave a Reply

Your email address will not be published. Required fields are marked *