Endre profilbilde! (Runding)


07.08.2015, 12:00

Kopier koden under og legg den inn nederst i stilsettet!

#profile a img {

max-width: 100%;

border: 0;

margin-left: 20;

padding: 0;

background: transparent;

border-radius: 100%;

-webkit-transition: all 0.5s ease;

-moz-transition: all 0.5s ease;

-o-transition: all 0.5s ease;

-ms-transition: all 0.5s ease;

transition: all 0.5s ease;

}

#profile a img:hover {

border-radius: 100%;

-webkit-transform: rotate(20deg);

-moz-transform: rotate(20deg);

-o-transform: rotate(20deg);

-ms-transform: rotate(20deg);

transform: rotate(20deg);

-webkit-filter: grayscale(100%);

}

 


 

Endre utseende/hva betyr forskjellige ting.

#profile a img {

max-width: 100%; -------------------> Full størrelse på bildet.

border: 0px; ------------------------------> Fjerner en svart ramme rundt bildet.

padding: 0px; ----------------------------> Fjerner forhåndskodet padding rundt bildet.

background: transparent; ---------> Fjerner en bakgrunnsfarge bak bildet.

border-radius: 100%; --------------> Gjør bildet helt rundt. Fjern denne linjen hvis du vil ha et firkantet bilde eller skriv et mindre tall.

-webkit-transition: all 0.5s ease;

-moz-transition: all 0.5s ease;

-o-transition: all 0.5s ease;

-ms-transition: all 0.5s ease;

transition: all 0.5s ease;

}

#profile a img:hover {

border-radius: 100%; -------------------------> Gjør så at bildet enda er rundt når man holder pila over.

-webkit-transform: rotate(20deg); ---------> Endre til høyere tall hvis du vil at bildet skal rotere mer når man holder pila over. Husk å endre på de under og!

-moz-transform: rotate(20deg);

-o-transform: rotate(20deg);

-ms-transform: rotate(20deg);

transform: rotate(20deg);

-webkit-filter: grayscale(100%); ----------> Gjør bildet grått når man holder pila over.

}

Ingen kommentarer

Skriv en ny kommentar

hits