8.01.2013

016. kody css dla kart ; darmówka



Cześć. Dzisiaj krótko i szybko, bo nie mam czasu. Po pierwsze chciałam podziękować za głosy i ciepłe słowa;* To bardzo ważne dla mnie i niewyobrażalnie miłe:)

Wszystkich, którzy są tu pierwszy raz i coś im się w mojej działalności podoba PROSZĘ O GŁOSY W SONDZIE NAD POSTEM. Za każdy głos bardzo dziękuję ;*


Na dziś nie mam zbyt wiele. Chodzę teraz na wszystkie wykłady (no bo sesja blisko, więc trzeba im się pokazać:p), a więc nie miałam czasu na tworzenie. Mam już zrobiony zaczątek zamówienia dla Leire, ale trzeba jeszcze to dopracować. Dla Erin zrobię w najbliższym czasie. Teksturę na zamówienie też zrobię. W weekend na pewno je dostaniecie dziewczyny ;* Tym czasem daję Wam darmówkę, którą zrobiłam w piątek albo sobotę, nie pamiętam. Łapcie. I piszcie, co sądzicie.

{aby podejrzeć i pobrać, kliknij w podgląd powyżej}



Wstawiam kody css, które ostatnio podawałam Wam w komentarzach pod kilkoma postami. Muszą być w jakimś uporządkowanym i dostępnym miejscu.

1. Stałe tło kart bez zmian po najechaniu myszką czy wyborze danej karty

.tabs-inner .widget li.selected a,
.tabs-inner .widget li a:hover,
.tabs-inner .widget li a {
background-image: url('adres obrazka');
}


UWAGA! Czasami kod ten nie działa (tło np. dalej robi się przezroczyste po najechaniu myszką) więc dodatkowo należy usunąć też taką treść z kodu HTML:
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
background: transparent none repeat-x scroll 0 -100px;
}

 Odszukiwanie danego kodu w kodzie HTML jest proste. Należy wcisnąć CTRL+f i wpisać szukany fragment:)


2. Odstęp między kartami o danym tle tak, by nie łączyły się ze sobą (podajemy wartość odstępu w pikselach)

.tabs-inner .widget li a {
background-color: #ffffff;
margin: 2px;
}


3. Zaokrąglone rogi kart po najechaniu myszką
 Pierwsze dwie wartości po 15 px odpowiadają za rogi górne, kolejne dwie wartości za rogi dolne.

.tabs-inner .widget li a:hover {
border-radius: 15px 15px 0 0;
}


4. Zaokrąglone rogi kart cały czas

.tabs-inner .widget li.selected a,
.tabs-inner .widget li a:hover,
.tabs-inner .widget li a {
border-radius: 15px 15px 0 0;
}


Są to kody na dodatkowe i oryginalne efekty. Oczywiście można stosować tło obrazkowe, obramowania, cień tekstu... Nie widzę jednak sensu pisać tutaj o tym, skoro z innych blogów można się tego dowiedzieć.
Jeśli nie chce Wam się szukać - pisać i pytać! Każdemu odpowiem w komentarzu i podam gotowe kody.



___________________________________________

Pod tym postem proszę nie zamawiać, dopóki nie dodam tu przyjętych wcześniej zamówień. Pozdrawiam;*






43 komentarze:

  1. Dlaczego, ja się pytam dlaczego?! Dlaczego zawsze patrzę na twoje pracę z otwartą buzią z zachwytu! Czemu ja nie dostałam zmysłu do kreowania! To niesprawiedliwe ;P
    I kody css, co ja wręcz uwielbiam, bo zawsze się z nimi męczę, więc obecnie nie kombinuje, ale zawsze może się przydać :D
    Życzę powodzenia przed sesją ;)
    Pozdrawiam, L. ;*

    OdpowiedzUsuń
    Odpowiedzi
    1. eee bez przesady :p ale cieszę się, że przynajmniej się podoba:) dzięki za życzenia, ja tam wierzę, że sobie poradzę i będzie bez większych problemów:p w każdym razie blog będzie prowadzony bez przerw, regularnie, choćbym pękła xD

      Usuń
  2. Prześliczny szablon. Cud, miód i orzeszki.
    Jeśli chodzi o studia, to gratuluję dostania się (wcześniej jakoś o tym nie pomyślałam, wybacz), i współczuję nawału pracy. Ja marudzę, że dużo jest u mnie w szkole, ale to co będzie na studiach, to będzie coś ... męczącego.
    Ale warto, naprawdę warto. :)
    Mam nadzieję, że wszystko Ci się na nich powiedzie.
    Pozdrawiam. ♥

    OdpowiedzUsuń
    Odpowiedzi
    1. cieszę się, że się podoba:) studia są dużo łatwiejsze. wcale nie jest tak źle, a i dostać się też nie jest ciężko. trzeba tylko wybrać uczelnię z głową - najczęściej ta z renomą, do której ciężko jest się dostać, później wyzyskuje na kasę własnych studentów i zamiast 5 lat studiów robi się 8, uwalają Cię na wszystkim i biorą kasę od Ciebie za każdy kierunek, który powtarzasz, w efekcie płacisz im za to, żeby spędzić tam kilka dodatkowych lat ekstra. dziękuję za ciepłe słowa i również pozdrawiam;*

      Usuń
  3. Jak już pisałam na DA, WOW :O On jest taki niesamowity. Ach... gdybym miała tylko bloga to bym go sobie porwała :D Ale czekam na koleżankę i jej opowiadanie ... Ach ... ale jestem pod wrażeniem co ona mi tam wymyśla :D Szykuje się jakieś fantasy xD Wracając do szablonu ... Magiczny <33 Kopara opada najniżej jak się tylko da *________*

    OdpowiedzUsuń
    Odpowiedzi
    1. O, a tak przy okazji. Pobrałam sobie szablon, żeby ustawić nagłówek na tapetę. Nacisnęłam ten przycisk i normalnie jeszcze większe WOW *.* Zrobiło mi się tak pięknie, magicznie, od razu chce się żyć <33 Także kocham i ubóstwiam nad życie :) A co do studiów to życzę powodzonka ;** Mam brata na tym samym kierunku, tylko że jest na pierwszym roku i jak widzę, jak on zakuwa do tych egzaminów to od razu żyć mi się odechciewa xD Ale na szczęście mam twój nagłówek na tapecie i sytuacja obraca się o 180 stopni :D

      Usuń
    2. Cieszę się, że tak Ci się podoba!:) Studia nie są tak złe, naprawdę. Trzeba się spiąć na kilka dni, pozakuwać co trzeba i tyle:) jest całkiem spoko, jak dla mnie lepiej niż w liceum - nie muszę się męczyć z durnym polskim, historią, wosem, geografią... ;]

      Usuń
    3. Hah, ale musisz się męczyć głównie z fizyką i matmą :D A co do studiów to nie odrzucam ich z góry, po prostu jeszcze trochę przede mną :D A to trochę to całkiem dużo xD

      Usuń
  4. Super notka , jak zwykle się spisałaś :) Kodów przybywa a ja się nareszcie zaczynam połapywać o co chodzi w Css'ie , dziękuję. Szablon cudowny. Oh i ah normalnie < 3333

    OdpowiedzUsuń
    Odpowiedzi
    1. Cieszę się, że szablon się podoba:) Może ktoś go przygarnie:) raz raz ogarniesz css'a, to bardzo proste:) trzymam za Ciebie kciuki! <3

      Usuń
    2. Dzisiaj próbowałam coś ogarnąć, ale css przegrał z nauką na niemiecki. :)

      Usuń
  5. Moje serce nie wytrzyma takiej ilości piękna.
    Kobieto, chcesz mnie zabić prawda?
    To jest idealne, koniec kropka - umarłam.

    OdpowiedzUsuń
    Odpowiedzi
    1. ee no bez sensu :< to nie ma zabijać! :< to jest po to, żeby ktoś sobie mógł przygarnąć to coś na bloga xD

      Usuń
  6. Szablon mnie wzruszył, autentycznie XD Aż mi łzy do oczu naleciały,tak mnie zdołowałaś.
    To jest cudo, autentyczne cudo, powinnaś się grafiką zajmować zawodowo i zarabiać na tym mamonę :D
    Dzięki Ci dobra kobieto za te tuoriale,idę coś kombinować <3

    OdpowiedzUsuń
    Odpowiedzi
    1. Wierz mi - oddałabym wszystko za to, żeby móc się tym zajmować zawodowo. Niestety nikt w tym naszym głupim kraju nie potrzebuje takiego czegoś aż tak bardzo, żeby dać za to choćby złotówkę. :<

      Cieszę się, że szablon się podoba - może go ktoś w końcu przygarnie:)
      Byłabym przeszczęśliwa:) kombinuj kombinuj i chwal się! <3

      Usuń
  7. Hej :) Nie wiem czy mnie pamiętasz z Onetu ale ja Ciebie doskonale :) Prowadziłam blog np. videovamp i kilka innych. Cieszę się, że znowu jesteś obecna w blogosferze. I widzę, że masz jeszcze większy talent. Dobrze że mam mocne serce bo to co tu oglądam może wprawić nie jedną osobę w stan przedzawałowy z zachwytu.
    Ja na razie nie kumam tego całego css'a ani html'a. Przydałby mi się kurs dla kompletnego żółtodzioba.. Może kiedyś dam sobie z tym radę :)

    Pozdrawiam,

    shimmyshame.blogspot.com

    OdpowiedzUsuń
    Odpowiedzi
    1. Jeśli masz problem z css'em korzystaj z gotowych kodów. Ja z html'em nic nie robię, tylko dodaję arkusze css (czytaj: wklejam tam kody, których tworzenie opisałam w jednym z tutoriali). Piszesz takie krótkie kody, które bardzo łatwo możesz sobie wymyślić, wklejasz to, zapisujesz i koniec:) Szablon zrobiony:) Ja zaczęłam się uczyć css'a... Może z 3 tygodnie temu? Nie wiem, ale ten blog jest praktycznie nowy. Zajęło mi to z dwa dni (?) i koniec:) i w ten właśnie sposób zrobiłam własny szablon;p może moja instrukcja (którą napisałam zaraz po tych dwóch dniach mojej nauki css'a:p) pomoże Ci w jakiś sposób szybko to ogarnąć, opisałam tam, jak zrobić szybciutko własny szablon bez studiowania poradników css. Prostym językiem, kilku osobom pomogło:) pozdrawiam ! <3

      Usuń
  8. Ale króciutki ten post! Myślałam, że poczytam coś więcej ;/ Ale skoro nie masz czasu to obejdę się smakiem. Szablon, który dodałaś jako darmówkę jest przepiękny! Ostatnio nie umiem się napatrzeć na te Twoje wszystkie prace. W ciągu roku, czy nawet dwóch zrobiłaś taki progres, że tylko pozazdrościć! A i dziękuję całym serduszkiem za te instrukcje. Bardzo się przydają. Niby takie pierdółki, a efekty są zachwycające. Chwała Ci za nie^^

    Co do mojej instrukcji to wiesz, myślałam, żeby napisać tutorial do tego obrazka z poprzedniego postu. Taki prościutki, ale zawsze coś. Może akurat ktoś by skorzystał. Ty może nie, bo już jesteś w zaawansowanej 'grupie grafików', no ale zawsze znajdzie się moim zdaniem jakiś początkujący, który z chęcią nauczy się czegoś nowego : )

    Oj, oj... sesja is comming ;P My już większość ocen mamy wystawione, więc nie ma takiej 'spiny'. Życzę powodzenia na tych egzaminach ;*

    OdpowiedzUsuń
    Odpowiedzi
    1. Sesja nie jest taka zła. Po prostu muszę kilka dni popracować. A potem znowu luz do następnej sesji:)

      Oczywiście, że powinnaś go napisać!! Nawet nie wiesz, jak takie tutoriale na proste efekty uczą. Uczą estetyki graficznej, uczą photoshopa... Same plusy. A to, że ja już grafikuję sobie kilka lat nie znaczy, że inni nie potrzebują pomocy:) ja też przecież zaczynałam kilka lat temu od instrukcji, które dzisiaj już niestety nieistnieją - blogi są pousuwane i tyle... Co by było, gdyby każdy postanowił takowych nie pisać, nawet na te proste efekty? Nic dziwnego, że do graficznego grona bloggerów z roku na rok dołącza coraz mniej osób, skoro coraz mniej jest miejsc, gdzie można się czegoś nauczyć. Dlatego właśnie powinnaś pisać instrukcję na KAŻDY, nawet prosty efekt. Musimy przekazywać swoją wiedzę, żeby następne pokolenia nas tu kiedyś zastąpiły:) I nigdy już nie mów, że się zastanawiasz nad jakimś tutorialem, nigdy nie pozwól sobie zwątpić w to, że będzie on przydatny. KAŻDY TAKI JEST! Pamiętaj o tym;*

      Dziękuję za życzenia, myślę, że wszystko pójdzie po mojej myśli:)

      Usuń
  9. Hej. Bardzo spodobał mi się szablon z tej notki, dlatego postanowiłam go pobrać:

    - adres bloga: http://zwierciadlo-snu.blogspot.com/
    -hasło: spectrum
    - numer szablonu: 9

    OdpowiedzUsuń
  10. jak tylko weszłam - wow! darmowy szablon jest wow, aż mi brakuje słów! Tworzysz magię :) kody przydadzą się, bo ja nooga z css ;d, a co do sesji to ucz się ucz! ja do matury powinnam się zacząć uczyć, ale coś mi nie idzie..także obserwuję Cię bo warto i to bardzo! <3

    OdpowiedzUsuń
    Odpowiedzi
    1. cieszę się, że szablon Ci się spodobał:) zapraszam częściej, w przyszłości postaram się dawać więcej kodów:) a sesja wcale nie jest taka straszna, kilka dni nauki i znowu wolne <3

      Usuń
    2. Tobie to dobrze :c u nas zamiast już darować te wszystkie spr i pozwolic spokojnie sie uczyć do maturky to niee :<<

      Usuń
    3. Ha, znam ten ból :< też przez to przechodziłam xD na studiach masz więcej luzu, ale za to wszystko musisz robić sam, nikt Ci nic nie powie. Masz zrobić projekt ale nie wiesz co ma w nim być. Ma być projekt i już, ale nikt nie precyzuje jasno swoich oczekiwań.

      Usuń
  11. Na Lucyfera! Zdecydowanie mój ulubiony szablon spod twoich rączek. Najbardziej podoba mi się motyw umieszczenia wszystkiego w księżycu. :)

    OdpowiedzUsuń
  12. Ten komentarz został usunięty przez autora.

    OdpowiedzUsuń
  13. Tupię nóżką, jak widzę, że mogę pomarzyć o takim poziomie. :x

    Ha!, nie uwierzysz. Polski Absurd Blogowej Grafiki przeniósł się na blogspot! Do czego to doszło? Myślałam, że Jet zostanie już na tym swoim pięknym oneciku. ;<

    OdpowiedzUsuń
    Odpowiedzi
    1. wiesz, jakie było moje zdziwienie, jak to zobaczyłam? szczerze, miałam ogromną nadzieję, że będzie się trzymać rączkami i nóżkami jej pięknej statystyki na starym blogu. ale to jest feniks, on się nie poddaje! statystyka przestała rosnąć i poszedł za ludem xD może ona faktycznie jest feniksem? to by tłumaczyło ewidentne błędy w każdym zdaniu przezeń napisanym.

      moim zdaniem - blogspot ostatecznie ją zje, bo powiedzmy sobie szczerze - tutaj ma szansę jedynie prowadzić pamiętnik. mam nadzieję, że jest świadoma tego, że teraz już nie wystarczy wyciąć kilku ikon z obrazków i nałożyć cudze koloryzacje. ciekawe, czy zacznie tworzyć szablony, a pewnie się do tego posunie... i to będzie zakończenie okresu bycia grafikiem dla niej.

      zresztą - już zaczynają jej pisać chamskie komentarze. blogspot nie będzie dla niej tak łaskawy jak onet. błędy błędami, ale postęp graficzny? jest tu tyle czasu co ja, a graficznie jest... nigdzie. wiesz, można po prostu nie umieć tworzyć i się do tego przyznać, ale ona dalej widzi w tym ukryty sens patetycznego przesłania, choć zdrowy umysł by powiedział po prostu: słaby warsztat.

      Usuń
    2. Ja to w ogóle nie wiem, po co ona się na Blogspot pcha. Z prochu powstałeś, w proch się obrócisz. Więc skoro ten jej feniks z prochu powstał, to... XD A co do chamskich komentarzy - zrobiła ze mnie podszywaczkę, z czego jeszcze bardziej cisnę, mówiąc potocznie (no beka, beka, nawet koleżanka mojej mamy, adwokat z zawodu, śmieje się z niej ostro: „No, Izunia, zrób mi jeszcze herbatki, tak z uchwałą majestatu”). Warsztat warsztatem, ale co ciekawego jest w kradnięciu tekstur? Nie dość, że nic nie umie, to jeszcze się wywyższa tępotą. „Pokażę swoje możliwości” - trzeba jeszcze je mieć.:)

      Yassmine, użyłam twoich tekstur (w pierwszym szablonie) tutaj:
      *prosektorycznie.blogspot.com/2013/01/3-zasmakuj-wiatru-szablon-nagowek.html
      * malach-tow.blogspot.com/2013/01/286-287-zasmakuj-wiatru.html
      hasełko: spectrum

      Usuń
    3. Też mi się wydaje, że szybko się ten feniks w proch obróci. A to wywyższanie tylko ten proces przyspieszy:p Zero pokory, która w jej sytuacji (liczne błędy, warsztatu brak, itd.) byłaby nawet wskazana.

      Cieszę się, że teksturki się przydały i pozdrawiam!;*

      Usuń
  14. Dzięki, dzięki, dzięki! Zaraz dodam Cię do linków ;))

    OdpowiedzUsuń
  15. kochana dodasz kod css jak wypośrodkować archiwum bloga.Zależy mi by między jednym a drugim miesiącem były kropeczki,lub serduszka,coś podobnego jak ma http://angelikasplace.blogspot.com/
    Odpisz mi na moim blogu dorotadz.blogspot.com
    Dzięki :)

    OdpowiedzUsuń
  16. Dzięki za pomoc! :)

    OdpowiedzUsuń
  17. Mam do ciebie pytanie. Jak zrobić takie menu jak ty masz? Chodzi mi o to, że ma inny kolor niż tło, a potem jak na niego najedziesz zmienia kształt i obrazek w tle ( i się rozszerza)... Pomożesz??

    OdpowiedzUsuń
    Odpowiedzi
    1. Jest na to instrukcja, tylko trzeba poszukać:p Zapraszam do Nawigacji > Instrukcje CSS (instrukcja nr 3).

      Usuń
  18. Czy mogłabym liczyć na pomoc? Jak między nazwami kart wstawić jakiś obrazek np. gwiazdkę? Z góry dziękuję

    OdpowiedzUsuń
  19. Czy mogłabym liczyć na pomoc? Jak między nazwami kart wstawić jakiś obrazek np. gwiazdkę? Z góry dziękuję

    OdpowiedzUsuń

Obserwatorzy