[1219-1223] Come here

[muzyka]

Na samym początku życzę wszystkim wesołych świąt! Mam nadzieję, że ten ostatni dzień spędzicie w radosnym i rodzinnym gronie ♥

Dziś przygotowałam 2 zamówienia i 3 darmówki, z czego jestem dumna, bo jeszcze wczoraj wieczorem miałam 2 szablony... No nieważne, przechodząc do ważniejszej części.

Zamówienia

Viktoria ;3 

Nie sądzę nic o tym szablonie, jest raczej znośny, tak sądzę.

Fan Cro †

Minimalizm wszędzie. 

Darmówki

 Robiłam ten szablon, bo mi się nudziło, ale teraz jakoś nie mam o nim zdania.

Andy moja wielka miłość, nie umiałam przejść obojętnie obok tak cudownego zdjęcia.

Szablon z propozycji. Całkiem przyjemnie się go robiło.

+ INSTRUKCJA NA KOLOROWE KARTY

a.navi:link {

display: inline-block;

width: 130px;

height: 20px;

margin: 2px;

font-weight: 380;

text-align: center;

text-decoration: none;}

a.navi:link:nth-of-type(4n+1) {background: #75682B;

color: #D5D4D1;

text-transform: uppercase;

font-size: 10px;

border-radius: 0px;}

a.navi:link:nth-of-type(4n+2) {background: #2C251D;

color: #D5D4D1;

text-transform: uppercase;

font-size: 10px;

border-radius: 0px;}

a.navi:link:nth-of-type(4n+3) {background: #2C251D;

color: #D5D4D1;

text-transform: uppercase;

font-size: 10px;

border-radius: 0px;}

a.navi:link:nth-of-type(4n+4) {background: #75682B;

color: #D5D4D1;

text-transform: uppercase;

font-size: 10px;

border-radius: 0px;}

a.navi:link:hover:nth-of-type(4n+1) {background: #302A22;

color: #DFDDD6;

webkit-transition: all 350ms;

-moz-transition: all 350ms;

-o-transition: all 350ms;

transition: all 350ms;}

a.navi:link:hover:nth-of-type(4n+2) {background: #6A5E3B;

color: #DFDDD6;

webkit-transition: all 350ms;

-moz-transition: all 350ms;

-o-transition: all 350ms;

transition: all 350ms;}

a.navi:link:hover:nth-of-type(4n+3) {background: #6A5E3B;

color: #DFDDD6;

webkit-transition: all 350ms;

-moz-transition: all 350ms;

-o-transition: all 350ms;

transition: all 350ms;}

a.navi:link:hover:nth-of-type(4n+4) {background: #302A22;

color: #DFDDD6;

webkit-transition: all 350ms;

-moz-transition: all 350ms;

-o-transition: all 350ms;

transition: all 350ms;} 

Gdzie:

Różowy - selektor określający link nawigacyjny

Jasny Fiolet - link nawigacyjny po wskazaniu na niego kursorem

Błękitny -  w tym wypadku stosowany jest wzór an+b, gdzie a to ilość "cykli" (tj. jeśli chcemy mieć np. 4 kolorowe karty wzór wygląda nth-of-type(4n+b)), n to licznik (rozpoczyna się od 0), a b to wartość przesunięcia (w tym wypadku ostateczny wzór prezentuje się następująco nth-of-type(4n+1){...} nth-of-type(4n+2){...} nth-of-type(4n+3){...} nth-of-type(4n+4){...} i na tym koniec; każde kolejne wielokrotności czwórki zostaną powtórzone w tej samej kolejności czyli karta nr 5 będzie miała te same parametry co 1, dalej 6 te co 2, następnie 7 odpowiednio te co 3 i wreszcie 8 takie same jak 4)

Pomarańczowy - odpowiednio kolory tła i czcionki

Czerwony - zaokrąglenia boków

Zielony - transformacje, w zależności od uznania można zmieniać na różne wartości (osobiście posługuję się ms, jednak można je zmienić na zwykłe s, wtedy najlepsze parametry to 1 lub 2)

Żeby wstawić karty w HTML/Java Script wklejamy

<a href="LINK" class="navi">NAZWA</a>

gdzie LINK - to link danej strony, a NAZWA to nazwa, jaką chcemy nadać konkretnej stronie.

To tyle w dzisiejszej notce, bez żadnych nagłówków ani sygnatur, same szablony. Zamówień nie przyjmuję, resztę oddam po nowym roku. Jeszcze razy wesołych! :)