sobota, lutego 28, 2015

Jak zrobić falbankę przy kartach?

   Jak pisałam ostatnio czas strasznie mi zleciał i nawet nie wiem, kiedy moje ferie przeminęły. Co gorsza - nic, co planowałam nie zrobiłam. Nie chcę robić kolejnych przerw w pisaniu i tym razem postaram się dodawać posty przynajmniej raz w tygodniu. Dzisiaj jednak nie na tym chciałam się skupić.
   Na pewno większość z Was kojarzy falbankę przy kartach u góry strony. Spotkałam się z tym już na paru blogach i zaczęłam myśleć jak to w prosty sposób wykonać. Długo nie musiałam się zastanawiać, bo już pierwszy pomysł okazał się sukcesem, więc chętnie się nim z Wami podzielę. 

Jak zrobić falbankę przy kartach, jak dodać falbankę do stron blogger, instrukcja, gotowe obrazki, kod CSS


    Specjalnie na potrzeby tego wpisu przygotowałam parę wzorów, które możecie wykorzystać. Wybrałam kolor biały, ponieważ wydawał mi się najbardziej uniwersalny. Jeśli będziecie postępować tak jak jest opisane, to nie powinno być problemów. Instrukcja jest bardzo łatwa i szybka, bo to tylko wklejenie jednego kodu i uzupełnienie go o odpowiedni link. Działa na pewno na szablonie typu Rewelacja. Gotowe wzory falbanek dostępne są na samym końcu.

Kod na którym będziemy pracować jest następujący:

.tabs-outer {background: url("adres URL"); height: 70px;}


   Jak widzicie falbanka to nic innego jak po prostu dodane tło i ustawiona odpowiednia wysokość. Kod wklejamy w arkusz CSS i uzupełniamy. Zamieniamy adres URL na link do wybranego obrazka podanego na końcu wpisu, bądź do własnego, a następnie ustawiamy wysokość - ważne by była ona taka sama jak wstawionej grafiki. U mnie zawsze to 70 px, więc jeśli korzystacie z poniższych obrazków to nie musicie tego zmieniać. 
Może się przydać:


    Tak jak wcześniej wspomniałam, niżej dołączam parę różnych falbanek (? - nadal nie wiem jak to nazwać), byście mogli wybrać coś dla siebie. Jeśli będą problemy to jak zawsze możecie do mnie pisać. Kontakt znajdziecie po prawej.

Mnie bardzo podoba się efekt, bo jest to coś innego, a nie takie zwykłe karty. 
A jakie jest Wasze zdanie o tym? Podoba Wam się?




O wiele lepiej wyglądają już dodane na bloga.
Jak zrobić falbankę przy kartach, jak dodać falbankę do stron blogger, instrukcja, gotowe obrazki, kod CSS Jak zrobić falbankę przy kartach, jak dodać falbankę do stron blogger, instrukcja, gotowe obrazki, kod CSSJak zrobić falbankę przy kartach, jak dodać falbankę do stron blogger, instrukcja, gotowe obrazki, kod CSSJak zrobić falbankę przy kartach, jak dodać falbankę do stron blogger, instrukcja, gotowe obrazki, kod CSSJak zrobić falbankę przy kartach, jak dodać falbankę do stron blogger, instrukcja, gotowe obrazki, kod CSSJak zrobić falbankę przy kartach, jak dodać falbankę do stron blogger, instrukcja, gotowe obrazki, kod CSS


-  -  -  -  -  -  -  -  -  -  -  -  -  -  -  -  -
POPULARNE INSTRUKCJE:
-  -  -  -  -  -  -  -  -  -  -  -  -  -  -  -  -



41 komentarzy:

  1. Jesteś wielka! Uwielbiam twoje instrukcje i porady, z tej na pewno skorzystam! <33

    amelia-bloog.blogspot.com

    OdpowiedzUsuń
    Odpowiedzi
    1. Cieszę się, że są przydatne :)

      Usuń
    2. Ja też uwielbiam <3

      Usuń
  2. Jeju od dłuższego czasu tego szukałam ♥ Cudowny i bardzo pomocny blog! Na pewno skorzystam z instrukcji.

    http://fascinated-blog.blogspot.com/

    OdpowiedzUsuń
  3. Super, wszędzie szukałam takiego tutorialu! Bardzo przydatne, jak będę zmieniać design to na pewno skorzystam <3

    Pozdrawiam!

    ♥ JULIA BLOG – NAJNOWSZY POST! KLIK ♥

    OdpowiedzUsuń
  4. Post na pewno przydatny :D twoje porady jak zawsze najlepsze
    Blog Maddy -> klik

    OdpowiedzUsuń
  5. na pewno przyda się wielu czytelnikom :D
    jestemfolta.blogspot.com

    OdpowiedzUsuń
  6. Przyda mi się :)
    paulan01.blogspot.com/

    OdpowiedzUsuń
  7. Bardzo pomocny post, jesteś genialna :)
    Zapraszam do mnie na ulubieńców miesiąca! zuzu-zuzannaxx.blogspot.com

    OdpowiedzUsuń
  8. Uwielbiam Twoje posty z serii "zrób design"! Naprawdę robisz pokazujesz wszystko dokładnie i w przejrzysty sposób. Dzięki Tobie zaczynam coś ogarniać w designach, haha :D
    Na pewno wykorzystam ten post! Dzięki!

    justsayhei.blogspot.com

    OdpowiedzUsuń
    Odpowiedzi
    1. Bardzo się cieszę! Mam nadzieję, że z czasem będzie jeszcze lepiej i już nie będzie to tylko małe "coś" ;)

      Usuń
  9. Bardzo pomysłowe:) Nigdy nie wiedziałam jak coś takiego zrobić. Post bardzo fajny ale nie skorzystam bo na razie nie zamierzam umieszczać koronek na blogu

    http://take-a-pencil-and-draw-a-f1.blogspot.com/

    OdpowiedzUsuń
  10. Hmm, a ja nie za bardzo wiem, o co chodzi. Albo nigdzie tego nie widziałam, albo widziałam, ale nie wiem, że to to. XD Mogłabyś podesłać linka do bloga, na którym to jest? Może wykorzystam u siebie, chociaż jak na razie nie mam żadnych widocznych kart, ale planuję! ;)

    OdpowiedzUsuń
    Odpowiedzi
    1. Może niedokładnie opisałam, ale zobaczyć możesz to np -> tutaj. ;)

      Usuń
    2. Ah, to o to chodzi! No i wszystko jasne. Dziękuję. :)

      Usuń
  11. Jeszcze nie widziałam takiego poradnika, bardzo ciekawy, na pewno skorzystam.
    Ja też nie mogę uwierzyć, że te ferie tak szybko minęły, już jutro trzeba wrócić do szkoły i zaczną się kartkówki, sprawdziany. Oby do wakacji.
    alenajpierwkawa.blogspot.com - w wolnej chwili :)
    + bardzo ładny wygląd bloga, taki estetyczny i staranny

    OdpowiedzUsuń
  12. Dziękuje za rady na pewno się przydadzą :)
    Jeżeli miałabyś chwilkę to bardzo proszę, wejdź do mnie na chwilkę i poklikaj w linki choies, spróbuje się jakoś odwdzięczyć ♥
    Mój blog || http://karrrblog.blogspot.com/ || Klik :)
    Z góry dziękuje :)♥

    OdpowiedzUsuń
  13. Bardzo przydatny post, mam nadzieje, że komuś się on przyda :)

    http://moooneykills.blogspot.com/2015/03/deer_3.html

    OdpowiedzUsuń
  14. świetne, wszystko zrozumiałam! na pewno komuś się to niezwykle przyda :D

    OdpowiedzUsuń
  15. Podoba, bo ciekawy pomysł. Wracaj do nas! Za długo cię nie ma ;)
    nie-zdepcz-mnie.blogspot.com
    przezstrony.blogspot.com

    OdpowiedzUsuń
  16. Wielkie dzięki za ten tutorial! Kiedyś zawzięcie szukałam tej instrukcji, a teraz już wiem jak wszystko zrobić! :)

    NOWY POST NA FABRYCE MIĘTY KLIK! :))

    OdpowiedzUsuń
  17. A masz moze jeszcze kod na to jak zmienić długość tej falbanki ?

    OdpowiedzUsuń
  18. Bardzo ciekawy post :) Twoje instrukcje są świetne ^^ Nie wiem jak ci dziękować. Sama trochę próbuję zmieniać wygląd bloga i twoje instrukcje są niezwykle przydatne :) A nie wiesz przypadkiem jak usunąć tło w odpowiedziach? Bo kiedy użyłam kodu na tło komentarza to nie zmieniło się w odpowiedziach :( Tylko jest cały czas szare i nie wiem jak je usunąć lub zmienić na inne :( Jeśli znasz na to kod to mogłabyś go mi podać? :) Bardzo mi na tym zależy ^-^

    Pozdrawiam :)

    OdpowiedzUsuń
  19. Bardzo fajny i pomysłowy blog! Masz bardzo ciekawe i przydatne posty :)
    Będę zaglądać częściej ♡

    http://mademoisellejuliet.blogspot.com/

    OdpowiedzUsuń
  20. bardzo dobrze opisane i bardzo pomocne :)
    ~zapraszam na mojego bloga

    OdpowiedzUsuń
  21. Przydatny post, bo ciągle chcę doskonalić wygląd mojego bloga ;) Nie wiedziałam wcześniej o takich technikach dodawania falbanek, dzięki!
    Zapraszam do mnie: sezonnamode.blogspot.com

    OdpowiedzUsuń
  22. w którym miejscu trzeba wstawić ten kod? Bo jak wstawiam go przed kodem, że jest (kod na to, żeby karty były wyśrodkowane) to są karty a obrazek przykrywa je i nic nie można odczytać, a jak wstawiam za nimi to jest tylko obrazek bez kart:( Pomóż

    OdpowiedzUsuń
    Odpowiedzi
    1. A mogłabyś napisać do mnie na maila? Postaram się na pewno pomóc i rozwiążemy problem :)

      Usuń
  23. Bardzo przydatny post! :)

    OdpowiedzUsuń
  24. Witaj. Bardzo ladny masz wyglad bloga i blog. Chcialam sie zapytac, czy wykonujesz wyglad bloga? Bardzo Cie prosze o odp w moim blogu w kom . :)

    http://yagodamelody.blogspot.com/

    OdpowiedzUsuń
    Odpowiedzi
    1. Niestety jak na ten czas nie wykonuję :|

      Usuń
  25. Uwielbiam takie ciekawe tutoriale. Zawsze to jakiś nowy sposób, by urozmaicić wygląd bloga. Kto wie, może w przyszłości wykorzystam falbanki :).

    Pozdrawiam ciepło,
    Ravi Ollie
    -------------------
    king of errors

    OdpowiedzUsuń
  26. Fajny blog :) przydatny!:) Obserwuję i zapraszam do siebie ;*

    OdpowiedzUsuń
  27. Twój blog jest mega przydatny. Dzięki tobie mój blog wreszcie jakoś wygląda. ;)
    http://bxrmadeth.blogspot.com/

    OdpowiedzUsuń
  28. Świetny blog! pozwoliłam sobie skorzystać z instrukcji :) dodaję do obserwowanych bo masz bardzo przydatne posty

    OdpowiedzUsuń
  29. Śliczne, ale mi nie działa :(

    OdpowiedzUsuń
    Odpowiedzi
    1. Co dokładnie? Może napisz do mnie na maila to Ci pomogę jakoś? :)

      Usuń

Komentować może każdy. | Brak weryfikacji obrazkowej.
Komentarze, gdzie będzie przeważał spam będą usuwane.