søndag 8. september 2013

Godt valg!

Heisann!

I morgen er det valgdag og det er en dag som føyer seg inn i en diskusjon om farger. Og hva har så en IT-blogg med en valgdag i Norge å gjøre?
Minst mulig! Eg har ikke tenkt å nytte dette til å sette mine ord på den norske IT-politikken. Det EG vil snakke om er farger!

Eg skrev i august i 2012 et innlegg om CSS og farger, som du kan lese her:
http://bamsehiet.blogspot.no/2012/08/css-og-farger.html

Om du leter litt videre på bloggen vil du finne både et innlegg om fonter OG om grafikk.
Kan være kjekt å få med seg.

Men tilbake til CSS og farger. Denne gangen her har eg lyst å vise kordan du på en god måte kan sette en farge på bakgrunnen som skifter farge etterhvert som brukeren scroller nedover siden.

Så om du skal lage en valgdag side kan du for eksempel starte med en farge øverst og få den til å ende opp i motsatt skala. Eksempelvis fra rødt til blått!

Her er koden:
body
{
background-image: -o-linear-gradient(bottom, rgb(107,136,254) 24%, rgb(212,146,40) 62%);
background-image: -moz-linear-gradient(bottom, rgb(107,136,254) 24%, rgb(212,146,40) 62%);
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.24, rgb(107,136,254)), color-stop(0.62, rgb(212,146,40)));
background-image: -webkit-linear-gradient(bottom, rgb(107,136,254) 24%, rgb(212,146,40) 62%);
background-image: -ms-linear-gradient(bottom, rgb(107,136,254) 24%, rgb(212,146,40) 62%);
background-image: linear-gradient(bottom, rgb(107,136,254) 24%, rgb(212,146,40) 62%);
}

Om du kopierer denne og limer den inn i notepad eller notepad++, som er det verktøyet eg personlig anbefaler for webutvikling (om du skal lære og gjøre ting selv), så vil det sikkert bli lettere å lese.

Det du skal legge merke til er at fargen du oppgir først på hver linje er den som skal ligge i bunn, mens farge nummer to er den du ser øverst. Om du ikke er godt kjent med web og farger vil eg du skal lese tidligere nevnte blogginnlegg, og trenger du en oppfriskning på det som går på selve farger kan du se her:
w3schools

Koden eg har presentert her i dag er ikke å anbefale om du har sider som er mindre enn en full skjerm. Da vil du få en repetisjon av fargeskalaen på siden din som ikke vil virke spesielt profesjonell.

Lykke til med å eksperimentere med denne kodesnutten og Godt Valg!

Om eg ikke blir brutt opp i bits eller inntar en binær form så vil det snart komme en ny blogg med nye erfaringer fra Mitt IT-eventyr!

Ingen kommentarer:

Legg inn en kommentar