Selektory CSS

31 grudnia 2014


Napisałam dla Was już parę instrukcji, ale zdałam sobie sprawę, że nie przedstawiłam Wam najbardziej podstawowej rzeczy - selektorów CSS, które jakby nie patrzeć są potrzebne przy jakichkolwiek zmianach. Dlatego dziś przedstawię Wam listę tych selektorów.
Ostatnio dostałam kilka maili od osób z pytaniami "Jaki jest kod na wyśrodkowanie nagłówka" "Jak zmienić nagłówki gadżetów" i jeszcze wiele wiele więcej. Selektory pomogą Wam w otrzymaniu odpowiedzi na dane pytanie.

Selektory ogólne

body - odpowiada za cały blog,dzięki temu selektorowi możemy ustawić np. ramkę lub tło dla całego bloga przykład 1,przykład 2
.content-outer - dzięki temu selektorowi, możemy utworzyć np. obramowanie lub cień. Obejmuje to obszary - nagłówka, postów, kolumny bocznej, pagera. Przykład 1, przykład 2.
 #Blog1 - odpowiada za obszar całego postu wraz z jego datą i pagerem bloga,dzięki niemu możemy ustawić np tło dla obszaru wpisu i pagera.
.Attribution - podpis w stopce bloga czyli miejsce gdzie jest napis Technologia Blogger
.navbar - pasek nawigacyjny na górze bloga
.cookie-choices-info - ramka z informacją o ciasteczkach
.cookie-choices-info .cookie-choices-text - tekst (informacja o ciasteczkach)
.cookie-choices-info .cookie-choices-button - przyciski w informacji o ciasteczkach
a:hover - wszystkie linki po najechaniu na nie myszką
.feed-links - napis Subskrybuj: Posty (Atom)

Nagłówek

.header - nagłówek bloga
.Header h1 - tytuł bloga
.Header .description - opis bloga, pod nagłówkiem

Posty

.post-outer - odpowiada tylko za obszar postu,bez daty i pagera.
.date-outer - odpowiada za obszar całego postu wraz z datą bez pagera,dzięki niemu możemy ustawić np. tło dla obszaru wpisu.
.date-header  lub h2.date-header - cały obszar nagłówka z datą (na całą długość posta)
.date-header span - tylko nagłówek z datą
.post-footer - stopka postu
h3.post-title - cały obszar tytułu posta (na całą długość)
h3.post-title a - tylko obszar tytułu posta
h3.post-title a:hover - tytuł posta po najechaniu na niego myszką
.post-author - autor w stopce posta
.comment-link - komentarze w stopce posta
.post-footer-line-2 - etykiety w stopce posta
.post-body  - obszar samego wpisu bez daty i tytułu posta
.post-body img  - wszystkie zdjęcia umieszczone w poście
.jump-link - przycisk czytaj więcej w poście
.jump-link:hover - przycisk czytaj więcej w poście po najechaniu na niego myszką
.post blockquote - cytaty w poście
.column-center-inner - odpowiada za obszar postu wraz z datą, stopką posta oraz pagerem.

Komentarze

.comment-header - nagłówek komentarzy z nazwą komentującego,datą i godziną. Przykład możecie zobaczyć u mnie na blogu
.comments h4 - nagłówek komentarzy nad wszystkimi dodanymi komentarzami pod postem.
.comment p  - wszystkie komentarze
.comments .comment .comment-actions a, .comments .thread-toggle a - przyciski odpowiedz i usuń pod komentarzem.
.comments .comment .comment-actions a:hover, .comments .thread-toggle a:hover - przyciski odpowiedz i usuń pod komentarzem po najechaniu na nie myszką.
.avatar-image-container - avatary obok komentarzy

Kolumna boczna

.column-right-inner - odpowiada za obszar całej prawej kolumny,selektor ten może nam posłużyć do ustawienia ramki kolumny lub tła
.column-left-inner - odpowiada za obszar całej lewej kolumny,selektor ten może nam posłużyć do ustawienia ramki kolumny,tła lub wielkości czcionki.
.column-right-inner .widget - dotyczy wszystkich gadżetów w prawej kolumnie
.column-left-inner .widget - dotyczy wszystkich gadżetów w lewej kolumnie

Gadżety

.sidebar .widget h2 - odpowiada za wszystkie nagłówki gadżetów w kolumnach bocznych
.widget h2 - odpowiada za wszystkie nagłówki gadżetów wraz z datą
.main-inner .widget h2 - odpowiada za wszystkie nagłówki gadżetów w kolumnach bocznych oraz za nagłówek z datą
#Label1  - cały obszar etykiet wraz z tytułem gadżetu.
.label-size a - tylko etykiety
#Label1 h2 - nagłówek gadżetu etykiety
#Label1 a:hover - linki etykiet po najechaniu na nie myszką
#BlogArchive1 - gadżet archiwum
#BlogArchive1 h2 - Nagłówek gadżetu archiwum
#BlogArchive1 a - linki w archiwum
#BlogArchive a:hover - linki archiwum po najechaniu na nie myszką
#ArchiveList  - sam lista archiwum bez nagłówka gadżetu
#Stats1  - gadżet statystyki
#Stats1 h2  - Nagłówek gadżetu statystyki
#Text1 - cały gadżet z tekstem,liczba 1 jest zmienna zależy od tego jaki nasz gadżet Tekst ma numerek,żeby to sprawdzić wystarczy wejść w układ-otworzyć nasz gadżet z Tekst i na górze przewinąć link do samego końca tam nam się pojawi jaki numer ma nasz gadżet.
#Image1 - cały gadżet z obrazkami na blogu,tutaj również liczba jest zmienna jak w przypadku gadżetu tekst i tak samo się to sprawdza.
#FollowByEmail1 - cały gadżet obserwuj przez e-mail
#HTML1 - cały gadżet HTML/JavaScript,tutaj również liczba jest zmienna jak w przypadku zdjęć i tesktu.
#Followers1 - cały gadżet z obserwatorami bloga
.popular-posts - cały gadżet popularnych postów
.popular-posts  .item-thumbnail img  - miniaturka popularnych postów
#BlogArchive1_ArchiveMenu - archiwum, styl menu
.FollowByEmail .follow-by-email-inner - gadżet obserwuj przez e-mail
.FollowByEmail .follow-by-email-inner .follow-by-email-address - pole do wpisywania adresu w gadżecie obserwuj przez e-mail
.FollowByEmail .follow-by-email-inner .follow-by-email-submit - przycisk do subskrypcji w gadżecie obserwuj przez e-mail

Strony/menu

.tabs-outer lub .tabs-inner - pasek stron
.tabs-inner .widget li a - same strony
.tabs-inner .widget li.selected a - aktywna strona tzn. strona na której obecnie się znajdujemy
.tabs-inner .widget li a:hover - strony po najechaniu myszką
#PageList1 - cały gadżet ze stronami
#PageList1 a - same strony
#PageList1 a:hover  - strony po najechaniu myszką

Stopka bloga/pager bloga

.footer-outer - stopka bloga
.footer-outer h2 - nagłówki gadżetów w stopce bloga
.blog-pager  - cały obszar pagera bloga (starsze,nowsze posty)
.blog-pager a - tylko obszar przycisków starsze,nowsze posty i strona główna
.blog-pager a:hover  - przyciski starsze,nowsze posty i strona główna po najechaniu na nie myszką
a.home-link - przycisk strona główna w pagerze bloga
a.home-link:hover - przycisk strona główna w pagerze bloga po najechaniu myszką
a.blog-pager-older-link - przycisk starsze posty
a.blog-pager-older-link:hover - przycisk starsze posty po najechaniu myszką
a.blog-pager-newer-link  - przycisk nowsze posty
a.blog-pager-newer-link:hover - przycisk nowsze posty po najechaniu myszką
Czytaj dalej »

Zniszcz ten dziennik - zaczynamy destrukcje!

26 grudnia 2014


Mój dziennik trafił w moje łapki. W końcu zmotywowałam się aby go zamówić i dotarł do mnie w idealnym czasie,bo na święta. Jak pewnie zdążyliście zauważyć,powstała specjalna podstrona dotycząca dziennika,znajdziecie w niej wszystkie posty,które przedstawiać będą moją destrukcję. Na Pinterest będziecie mogli obejrzeć zdjęcia z każdego zadania, będę się pojawiać po każdym wpisie.
Dziś pierwszy destrukcyjny post.




Ten wpis traktuje jako wstęp. Jak pewnie się domyślacie mój dziennik wygląda jeszcze jak nówka sztuka nie śmigany,nawet pachnie nowością. Przyznam się szczerze,że nie przeglądałam dziennika i nie wiem jakie są w nim zadania oprócz trzech,które widziałam na internecie. Idę na tzw. żywioł i tak chyba jest najlepiej. Oczywiście dwa pierwsze zadania,te najprostsze,które nie wymagają zbyt wielkiego kombinowania rozwiązałam i dziś oprócz słowa wstępu je wam zaprezentuje.
Z zewnątrz dziennik wygląda jak zwykła książka,nic z niej nie wycieka,nie klei się,nie ma jakiś super efektów. Zwykła książka w czarnej oprawie z tytułem,który może wielkich miłośników książek oburzać.


Strona tytułowa,niczym się nie wyróżnia,podobne strony tytułowe widuje się w każdej książce - tylko w normalnych książkach nie ma dopisku "kreatywna destrukcja" 


Za stroną tytułową spotykam nie spotykaną rzecz,mianowicie ostrzeżenie,widzieliście w jakiejś książce ostrzeżenie? Ostrzeżenie jest bardzo nietypowe.


Dziennik przygotował również dla nas wskazówki,jak przeprowadzić destrukcje


Oraz listę materiałów:

To tyle jeśli chodzi o słowa wstępu,bo co ja wam będę mówić,po prostu trzeba zniszczyć ten dziennik i dobrze się bawić. Przejdźmy teraz do naszej destrukcji. Wykonałam dwa pierwsze zadania,ponieważ tak jak już wspomniałam są to zadania najprostsze i właśnie Wam je dzisiaj zaprezentuje.

Pierwsze zadanie to podpisanie naszej książki,ale oczywiście nie byle jak o to co musimy wykonać:



Efekt końcowy:


Drugie zadanie to nic innego jak zabawa z numeracją stron


No to zaczynamy numerować. Wymyśliłam sobie,że od tej strony zacznę tak jak jest napisane i cofnę się do stron,które już minęłam,kolejne strony będą numerowane w takiej kolejności jakie będę robiła zadania - nie będę robiła zadań po kolei,będę wykonywać te,na które akurat przyjdzie mi pomysł.




Moja przygoda z dziennikiem rozpoczęta,a Wy macie dzienniki? co o nich sądzicie? dzielicie się swoją destrukcją z innymi na blogu? Jeśli tak podajcie link w komentarzu,a ja z chęcią popatrzę jak przebiega wasza destrukcja :)


Na koniec jeszcze mam dla Was wyniki ankiety,w której mogliście głosować na posty,które chcecie czytać.


Jak widzicie największą liczbę głosów zdobyły tematy takie jak opinie i przemyślenia oraz tutoriale,na drugim miejscu znajdują się tematy DIY,a na trzecim użyteczne origami. Na Grafiki do pobrania i inne tematy głosów nie było.
Związku z tym,że znaczna cześć osób chce więcej tematów związanymi z tutorialami oraz tych gdzie pisze swoją opinie,wezmę to pod uwagę i postaram się aby tych postów było więcej,przeplatając to tematyką DIY,bo jak widzicie tutaj też znaczna cześć osób lubi tematy związane z DIY,trochę rzadziej będą się pojawiały tematy związane z origami,chociaż niektóre z nich można podczepić pod DIY i tak robię. Jeśli chodzi o grafiki do pobrania i inne tematy będą się pojawiały rzadziej,chociaż i tak za często się nie pojawiają. Taki rozmach gdzie się pojawiały dość często to był pod koniec listopada/początek grudnia.
Czytaj dalej »

10 tekstów,które usłyszałam po śmierci rodzica.

19 grudnia 2014


Długo się zastanawiałam nad tym czy ten post opublikować,gdzieś tkwił w wersjach roboczych i nie mogłam się do niego przekonać. Jednak postanowiłam go opublikować i nie w celu współczucia,litości czy jeszcze czegokolwiek innego,po prostu chce wam pokazać,że oprócz kondolencji można usłyszeć całkiem coś innego.

Czytaj dalej »

Jak to było w liceum o profilu jeździeckim

18 grudnia 2014


Ostatnio pisałam post o tym dlaczego żałuje,że poszłam do liceum,a nie technikum. Dziś mam dla was post,w którym krótko opowiem o mojej przygodzie związanej z liceum o profilu jeździeckim. Brzmi to trochę dziwnie prawda? ale takie liceum o tak nie typowym profilu się znajduje,dokładnie ok. 25 km. od Lublina. W tym wpisie postaram się przedstawić wszystkie plusy i minusy tego właśnie liceum i dlaczego z niego zrezygnowałam.
Szkoła miała być tą moją jedyną,wymarzoną,obrałam sobie na nią cel,kiedy tylko się o niej dowiedziałam,a mój tata powtarzał mi,że to coś dla mnie - w końcu parę lat jazdy konnej miałam za sobą,więc tkwiłam w przekonaniu,że to idealny profil dla mnie. Mieszkam kawałek od Lublina,bo do centrum mam ok. 25 km,do szkoły miałam tych kilometrów 50,czyli jak można się domyśleć mieszkałam po drugiej stronie. Na całe szczęście szkoła oferowała zamieszkanie w internacie,który mieścił się dosłownie dwa kroki od szkoły - z tej możliwości korzystałam jak najbardziej.  Można powiedzieć,że to się zalicza do plusów. W pewnym stopniu tak,jednak patrząc na to z drugiej strony,zaliczam to do minusów. Pokoje były,łazienki i wyżywienie też,także to co potrzebne do życia każdemu człowiekowi się znajdowało i można powiedzieć,że nie ma co narzekać. Jednak ja napotkałam pewien problem. Mianowicie po pierwszym miesiącu mieszkania w internacie,wychowawca poinformował mnie,że w związku z tym,że nie mam daleko do domu (bo przecież 50 km to nie tak dużo) mam na każdy weekend wracać do domu,a w internacie mogą zostać tylko osoby,które mieszkają daleko. Na nic zdały się tłumaczenia,że moja mama na pieniądzach nie śpi i wydawanie co tydzień 30 zł na to abym ja sobie tak wracała (bo wychowawca z internatu ma widzimisię) to jednak nie taki mały wydatek,szczególnie,że oprócz kosztów mojej podróży trzeba było co miesiąc pokryć koszty internatu,moich leków oraz chcąc nie chcąc,kieszonkowe jakieś musiałam otrzymać chociażby na to abym kupiła sobie coś do picia. Internat żył własnymi zasadami,których nie sposób było ogarnąć,na decyzje wychowawcy (który tłumaczył się tym,że to decyzja od górna) nikt nie miał wpływu. Ładniej mówiąc,co tydzień w piątek po lekcjach zostawałam z internatu oddelegowana do domu. Teraz się z tego śmieje jednak wtedy nie było mi do śmiechu.
Nauka w liceum wyglądała jak w każdej normalnej szkole,jedynym innym dodatkiem było to,że po lekcjach w ramach WF (spokojnie normalny wf też był) odbywały się zajęcia z jazdy konnej. Był podział na grupy,każdy miał przydzielonego konia. Zajęcia odbywały się od poniedziałku do czwartku,brano pod uwagę to,że popołudniu w piątek są osoby,które mogą wracać do domu,więc zajęcia od piątku do niedzieli były dla chętnych. Do prowadzonych zajęć z jazdy nie mam zarzutów,aczkolwiek jeśli ktoś się nastawia na typowo indywidualne podejście to niech o tym zapomni szybko. Trener jest,patrzy,mówi co i jak,jednak ciężko jest skupić się na jednej osobie przez cały czas gdy dookoła jest jeszcze 7 innych osób (grupy na zajęciach były zazwyczaj 8 osobowe,rzadko zdarzało się,że było więcej) Kiedy się nie chodziło na zajęcia,a było się w grupie wyżej to na podstawie frekwencji spadało się o grupę niżej- wiadomo braki w umiejętnościach,osoby,które przychodziły tam nie umiejąc jeździć trafiały do grupy najsłabszej,dobrze było dla nich jak przyjmowały wszelkie informacje szybko,niestety tam nie było czasu na to aby się dłużej skupić na czymś tak jak np. na jazdach w szkółce,gdzie instruktor na każdej jeździe pamięta kto na jakim etapie jest i potrafi przez 4 kolejne jazdy wałkować to samo aż do skutku,tu liczyło się tępo i to aby dogonić grupę. Fajnym pomysłem było co poniedziałkowe zajęcia z jeździectwa naturalnego (nie wiem czy to jest do tej pory) do dzisiaj pamiętam moje zmagania z jazdą na kantarze sznurkowym i lince,po których stwierdziłam,że to chyba nie dla mnie i abym się do tego przekonała to musiałabym jeździć tak codziennie. Wielkim minusem podczas jazd była tzw. widownia. Osoby z grupy wyżej siedziały,patrzyły i wyśmiewały się z osób z grupy niżej chodź w tym czasie mogły robić zupełnie co innego,wiem od koleżanki,która tam poszła rok po mnie,że się to zmieniło i osoby,które skończyły swoje jazdy wracały grzecznie do internatu. Nie wiem czy to utrzymało się do tej pory,ale mam wielką nadzieję,że tak,bo taka "widownia" była naprawdę bardzo stresująca. Oprócz zajęć praktycznych,które oczywiście zaliczam do plusów, mieliśmy również zajęcia teoretyczne,na których oglądaliśmy filmy,omawialiśmy wszystko oraz ustalaliśmy co będziemy robić w kolejnych tygodniach na zajęciach. Atmosfera w klasie była jaka była,nie ukrywam,że ja trafiłam na klasę,która nie miała żadnego zgrania,niektórym osobom przyjemność sprawiało dokuczanie innym,traktowali to jako zabawę i wybierali kolejne ofiary,z których można było zrobić pośmiewisko ,a na dodatek wychodziły różne ploty o czym mogłam się przekonać po odejściu z tej szkoły. Wiadomo nie każdy rocznik się taki trafi,mi niestety się trafił. Wielkim jak dla mnie minusem było połączenie wszystkich klas licealnych w jedną. Klasa bio-chem,dziennikarska,europejska i jeździecka tworzyły jedną klasę ze względu na małą ilość osób w każdej z tych profili. Było to bardzo dziwnie i nie komfortowe. Kolejnym minusem był problem z zaakceptowaniem mojego zwolnienia lekarskiego. Niestety przytrafiła mi się kontuzja,która uniemożliwiała mi dalsze uczestnictwo w jeździe konnej oraz braniu udziału w zajęciach wf-u. Moje zwolnienie,które było wypisane na jazdę konną i wf zostało zaakceptowane tylko na zajęcia z wychowania fizycznego,na jazdę konną nie,mało tego,trener o zwolnieniu nie słyszał i kiedy poszłam do niego na rozmowę miesiąc po wystawieniu zwolnienia wtedy się o nim dowiedział - niestety ocenę miałam wystawioną z jeździectwa na koniec szkoły,jedyny pozytyw z tej sytuacji to to,że trener był tak przychylny i wystawił mi ocenę pozytywną. Nie wspominam tej szkoły za dobrze,jedyne co wspominam najlepiej to czas kiedy szło się na zajęcia z jeździectwa. Jeśli chodzi o resztę to miało się wrażenie,że działa to wszystko bez jakiejkolwiek organizacji i żeby coś uzyskać trzeba było się natrudzić. Między innymi zrezygnowałam z tej szkoły przez ten brak organizacji i trudność w załatwieniu czegokolwiek,jednakże głównym powodem była nabyta kontuzja i problemy zdrowotne,których się nabawiłam przebywając w internacie.


Czytaj dalej »

Jak wykonać aktywny przycisk czytaj więcej + odpowiedzi na pytania

16 grudnia 2014

Tak naprawdę jest to bardzo proste do zrobienia i wielkiej filozofii w tym nie ma. Taki aktywny buton "czytaj więcej" możemy wykonać za pomocą kodów CSS. Pokażę wam dwa kody i różne opcje jak taki buton można dostosować do własnych potrzeb.
Pierwsze co należy zrobić aby taki buton posiadać to oczywiście zastosować na swoim blogu zwijanie tekstu. Taką możliwość mamy podczas tworzenia postu. Opcja ta znajduje się obok ikonki,która umożliwia nam wstawianie filmów.



Trzeba pamiętać aby kliknąć w tą ikonkę po fragmencie tekstu,który ma się wyświetlać jako nasz wstęp,oczywiście można tą opcje zastosować po głównym zdjęciu,które wstawiliśmy na początku wtedy pojawiać nam się będzie tylko pierwsze zdjęcie i buton,który zaprowadzi nas do wpisu.

Jak widać po wybraniu opcji zwijania tekstu pojawia nam się szara kreska,która pokazuje nam,w którym miejscu oddzieliliśmy nasz tekst i która jego część będzie widniała na stronie głównej.
Nasz buton obecnie jest mały i słabo widoczny,ale dzięki temu tutorialowi zmienimy to. Zaczynamy.

Jeśli nie chcesz posiadać aktywnego butony (który się zmienia po najechaniu myszką) omiń punkt II.

I. Najpierw zajmiemy się kodem,który odpowiada za wygląd "czytaj więcej" przed najechaniem na niego myszką.

1. Nasz buton znajduje się obecnie po lewej stronie,ale co zrobić aby znajdował się po środku lub po prawej stronie? Należy wpisać ten kod:

.jump-link a, #blog-pager-post a {text-align: center; } lub .jump-link a, #blog-pager-post a {text-align: right; }

Nasz odnośnik do wpisu został ustawiony.

2. W tym punkcie zmienimy wielkość i rodzaj czcionki "czytaj więcej" za pomocą tego kodu:

.jump-link a, #blog-pager-post a {font: normal 30px Times New Roman;} 

 pogrubienie to są wartości zmienne,pierwsza to wielkość czcionki,a druga to rodzaj,można się tu pobawić i dopasować wedle uznania.

3. Teraz dodajmy "efekty specjalne" takie jak: tło,marginesy,zaokrąglenia,ramka,kolor linku.

A. Kod odpowiadający za tło naszego butonu: (pamiętamy o tym,że wartości pogrubione to wartości zmienne)

.jump-link a, #blog-pager-post a {background-color: #f8ecf3;} 
lub
.jump-link a, #blog-pager-post a {background-image: url(adres do obrazka);}

B. Marginesy:

.jump-link a, #blog-pager-post a {margin: 0px 265px 0px 265px;}

Pierwsza wartość to margines górny,odpowiada on za odległość między tekstem/zdjęciem,a buttonem.
Druga wartość to margines prawy,dzięki niemu możemy ustawić długość naszego butonu.
Trzecia wartość to margines dolny,odpowiada za odległość między tym co znajduje się pod butonem.
Czwarta wartość to margines lewy i ma takie samo zastosowanie jak margines prawy

C. Zaokrąglenia:

.jump-link a, #blog-pager-post a {border-radius: 10px 10px 10px 10px;}

Pierwsza wartość odpowiada za górny lewy róg
Druga wartość odpowiada za górny prawy róg
Trzecia wartość odpowiada za dolny prawy róg
Czwarta wartość odpowiada za dolny lewy róg

D. Ramka:
Rodzaje ramek: solid - linia ciągła, double - linia podwójna, dashed- linia kreskowana, dotted - linia kropkowana 

.jump-link a, #blog-pager-post a {border-style: solid;}

Grubość ramki:

.jump-link a, #blog-pager-post a {border-width: 1px;}

Kolor ramki:

.jump-link a, #blog-pager-post a {border-color: #cccccc;}

E. Kolor linku:
Aby kolor linku zmieniał nam się po najechaniu wystarczy w projektancie szablonów wejść w zakładkę linki.


Ważne jest aby kolor linku był inny od koloru linku po wskazaniu kursorem.

II. Aktywna części butonu.

Kody wyglądają tak samo jedyne co musimy dodać przed .jump-link, #blog-pager-post a to :hover,czyli ma to wyglądać tak:

.jump-link a:hover, #blog-pager-post a:hover

Po tym możemy wpisywać wszystkie te opcje co podane w punkcie 3. Pamiętaj jednak,że aby efekt był zamierzony to musisz pozmieniać niektóre wartości,aby różniły się wyglądem od butonu przed najechaniem na niego myszką.
Co możesz zmieniać? kolor tła,ramki,kolor ramek i ich grubość oraz zaokrąglenia.


Teraz nadszedł czas pytań i odpowiedzi. 
Monika z bloga classic&red nominowała mnie do  Liebster Blog Award 2014 i moim zadaniem jest odpowiedzieć publicznie na zadane przez nią pytania,które umieściła na swoim blogu i nominować kolejne osoby. Nominować nikogo nie będę,bo zupełnie nie mam pomysłu na pytania. 

1. W jaki sposób najchętniej wypoczywasz? 
- Najchętniej wypoczywam w stajni,spędzam tam każdą wolną chwilę.
2. Wymarzone miejsce na wakacje? 
- Raczej trzymam się zasady,że nie ważne gdzie,ważne z kim. Jak ma się odpowiednie osoby wokół siebie to każde miejsce staje się tym wymarzonym. 
3. Ulubiony deser? 
- Koktajl owocowy 
4. Jak według Ciebie powinna wyglądać idealna randka?
- Spacer po parku
5. Ufasz bardziej lekom z apteki,czy naturalnym środkom z Twojej kuchni? Weź pod uwagę działanie i ewentualne skutki uboczne.
- Zdecydowanie lekom. Jestem alergikiem i naturalne środki mogłyby mi zaszkodzi niż pomóc. 
6. Jaka jest dla Ciebie najważniejsza cecha u mężczyzn? 
- Cierpliwość 
7. Kot czy pies? 
- Pies 
8. Jaki film mi polecasz? 
- Na pewno być może 
9. Najzabawniejsza sytuacja,która Cię spotkała? 
- Pozostawię to dla siebie :) 
10. Ulubiona piosenka? 
- Nie mam ulubionej piosenki. 
11. Jaki jest twój kosmetyczny ulubieniec? 
- Oliwkowy balsam do ust z Ziaji 

Aktualizacja 11.02.2015

Czytaj dalej »

Czemu żałuje,że wybrałam liceum,a nie technikum?

13 grudnia 2014


Nie ukrywam tego,że żałuje mojego wyboru szkoły ponadgimnazjalnej. Śmiało można powiedzieć,że głupia byłam i to bardzo,tak naprawdę wybór nie był do końca mój,był spowodowany raczej presją otoczenia (a ja jak ta zbłąkana owieczka za tłumem poszłam) gimnazja na wsi,gdzie liczba uczniów nie przekracza nawet 600 osób są może i fajne pod pewnymi względami,jednak w ostatniej klasie,kiedy chodzi się na rozmowę do pani pedagog,która ma pomóc nam wybrać szkołę robi się mniej atrakcyjnie.

W mojej sytuacji bardzo duży wpływ na wybór szkoły miało właśnie gimnazjum,a właściwie osoby,które tam napotkałam. Myślenie tych osób (co teraz mogę stwierdzić po pewnym czasie) było bardzo płytkie,każdy miał obrany cel na liceum,a jak ktoś powiedział,że idzie do technikum był uważany za idiotę. Tak naprawdę nie ważne czy wybrałeś sobie najlepsze lub najgorsze liceum w mieście,ważne że jak mówiłeś o swojej przyszłej szkole to padło to "magiczne" słowo LICEUM. Po pierwszym roku mojego uczęszczania do szkoły średniej zorganizowaliśmy spotkanie klasowe osób z gimnazjum,możecie wierzyć lub nie,ale dziewczyna,która tak bardzo miała wpajane to,że trzeba iść do liceum wybrała technikum i bardzo wstydziła się do tego przyznać,a jak już się przyznała to inni jakoś tak patrzyli na nią spod łba. Jak się nad tym zastanowić to ona tak naprawdę podjęła słuszną decyzje,przynajmniej nie żałuje - z tego co wiem - tak jak ja i paru innych moich znajomych wyboru szkoły.
Przejdźmy do sedna. Dlaczego żałuje? Ujmę to w 4 punktach.

  1. Po technikum miałabym wybór - napisać egzamin zawodowy,maturę czy może jedno i drugie,no niestety licea nie mają takiego rozmachu i żeby ten świstek o wykształceniu średnim się liczył trzeba zdać maturę,osobiście wolałabym zdać maturę + egzamin zawodowy,tak jak teraz na to patrzę trzeźwym okiem byłoby to najlepsze rozwiązanie. Miałabym już jakąś praktykę dotyczącą danego zawodu. 
  2. Po ukończeniu technikum miałabym jakiś zawód (przynajmniej na świstku),zaliczone praktyki,przedmioty zawodowe (a jak wiadomo pracodawcy bardzo często chcą jakiegokolwiek doświadczenia) i po 4 latach nauki wiedziałabym z czym to wszystko się je,na chwilę obecną po ukończeniu liceum,nie poszłam na studia ponieważ aby dostać się na kierunek,który sobie upatrzyłam musiałam poświęcić jeszcze więcej czasu (rok przerwy) na lekcje rysunku aby mieć jakiekolwiek szanse + dodatkowe kursy,aby wiedzieć co,jak i gdzie.
  3. Po technikum nie trzeba iść na studia (jak się ma zdany egzamin zawodowy) aby znaleźć pracę,szczerze mówiąc znam sporo osób,które po tych czterech latach technikum znalazły szybciej pracę niż ktoś po studiach,a niestety po liceum wypada na te studia pójść,bo co nam pozostanie jeśli się nie wybierzemy na jakąś uczelnie? 
  4. Poziom nauki jest powiedzmy,że podobny jeśli chodzi o liceum i technikum,nawet spotkałam się z tym,że znajomy z technikum miał więcej nauki z przedmiotów maturalnych niż ja w liceum,ale nie o tym teraz mowa. Dla mnie,dla osoby,która była zdecydowana co chce robić w życiu,liceum to nie była dobra opcja,cały czas uważam,że liceum to dobry wybór dla kogoś kto nie wie co chce jeszcze robić i potrzebuje tych 3 lat na namyślenie się,ja przez te 3 lata siedziałam i myślałam "co ja tutaj robię" 
Oczywiście to tylko moja własna opinia,która powstała na podstawie obserwacji,doświadczenia,rozmów z innymi,ale również takie zdanie a nie inne wzięło się stąd,jak rozmawiałam ze swoim partnerem o jego edukacji w technikum. Strasznie mu zazdrościłam,że ma aż tyle praktycznych zajęć i tyle przygotowań do przyszłego zawodu,bardzo mi się to podobało i za każdym razem bluzgałam na siebie jaka to ja byłam głupia,czemu posłuchałam się osób z gimnazjum,którzy dostanie się do liceum traktowali jako prestiż i coś bardzo wyjątkowego. Jakbym teraz miała ponownie stanąć przed decyzją wyboru szkoły ponadgimnazjalnej,bez wahania odpowiedziałabym - technikum. 
Czytaj dalej »

Jak w prosty sposób zmienić wygląd etykiet

10 grudnia 2014



Etykiety - gadżet dzięki,któremu łatwiej jest nam coś znaleźć na blogu. Miło jest gdy nawet taki gadżet jak etykiety wygląda tak jak chcemy dlatego w dzisiejszym tutorialu pokarzę wam jak w prosty sposób odmienić nasze etykiety.


Do zmiany wyglądu etykiet będzie nam potrzebny następujący kod:

.label-size a{
 float: left; 
 height: 30px;
 line-height: 30px; 
 position: relative;
 font-size: 14px;
 margin-bottom: 10px;
 margin-left: 10px;
 padding:0 20px 0 20px;
 background:#000;
 color:#fff;
 text-decoration:none;
 -moz-border-radius-bottomright:0px;
 -webkit-border-bottom-right-radius:0px;
 border-bottom-right-radius:0px;
 -moz-border-radius-topright:0px;
 -webkit-border-top-right-radius:0px;
 border-top-right-radius:0px;
 }

.label-size a:hover{background: #ccc;}

Teraz przeanalizujmy nasz kod krok po kroku
.label-size a{
 float: left; - położenie etykiet 
 height: 30px;  - wysokość     
 line-height: 30px; - wysokość  (ważne jest żeby w tych dwóch miejscach były takie same wartości) 
position: relative;
 font-size: 14px; - wielkość czcionki 
 margin-bottom: 10px; - margines dolny 
 margin-left: 10px; - margines lewy 
 padding: 0px 20px 0px 20px;  - wielkość naszych etykiet pierwsza wartość odpowiada za górną krawędź naszych etykiet, druga wartość odpowiada za długość prawego boku,trzecia wartość odpowiada za dolną krawędź etykiety,czwarta wartość odpowiada za długość lewego boku. 
 background:#000; - kolor naszych etykiet
 color:#fff; - kolor tekstu 
 text-decoration:none;
 -moz-border-radius-bottomright:0px;
 -webkit-border-bottom-right-radius:0px; - zaokrąglenie prawego dolnego rogu 
 border-bottom-right-radius:0px;
 -moz-border-radius-topright:0px;
 -webkit-border-top-right-radius:0px; - zaokrąglenie prawego górnego rogu 
 border-top-right-radius:0px;
 }

.label-size a:hover{background: #ccc;} - kolor etykiety po najechaniu na nią myszką 


Ps. Bardzo ważne jest aby przy tym nasze etykiety były wyświetlane w formacie chmury
Ps2. Zapraszam wszystkich fanów DIY do polubienia jedynej takiej strony na Facebooku. Stronę tworzą rękodzielnicy podsyłając do administratorów swoje pomysły wraz ze zdjęciami i dokładnymi instrukcjami STRONA - KLIK  strona dopiero się rozkręca,więc będzie naprawdę miło jak przybędzie trochę lajków :)
Ps3. Dajcie znać w komentarzu co myślicie o nowej szacie graficznej bloga,postawiłam jednak na kafelki - według mnie dzięki nim blog jest bardziej przejrzysty.
Czytaj dalej »

Jak wstawić gadżet wyszukiwania i dostosować jego wygląd

3 grudnia 2014


Gadżet wyszukiwania,każdy zna. Jest to bardzo pomocny gadżet,szczególnie przy blogach lifestylowych,ponieważ umożliwia nam wyszukanie danego artykułu bez przeszukiwania całego bloga. W dzisiejszym tutorialu pokaże wam jak w prosty sposób wstawić swój własny gadżet wyszukiwania i dostosować jego wygląd do naszego bloga.

1. Przechodzimy do układ - dodaj gadżet - HTML/JavaScript


2. Kiedy otworzy nam się okno HTML/JavaScript  wpisujemy następujący kod:

<style>
#wc-searchblack1
{
background: #0db7b3;
border-radius:10px;
width:280px;
}

#wc-searchblackbox1
{
padding:10px;
}

#wc-searchblacksubmit1
{
border:1px solid #ff5353;
background: #ff5353;
padding:5px;
color:#ffffff;
font:14px Times New Roman;
}

#wc-searchblackinput1
{
-moz-border-radius: 10px;
-khtml-border-radius: 10px;
-webkit-border-radius: 10px;
border:1px solid #ffffff;
background:#ffffff;
padding:5px;
color:#888888;
width:178px;
font:14px Times New Roman;
}

</style>
<div id='wc-searchblack1'>
         <form name="input" action="Link do naszego bloga/search"  method="get"  id="wc-searchblackbox1"> 
            <input name="q" id='wc-searchblackinput1' onblur='if (this.value == "") {this.value = "Wyszukaj...";}' onfocus='if (this.value == "Wyszukaj...") {this.value = ""}' type='text' value='Wyszukaj...'/>
            <input id='wc-searchblacksubmit1' type='submit' value='Szukaj'/>
         </form>
      </div>
2a. Analizujemy kod.

Ta część odpowiada za ten element:

           <style>
#wc-searchblack1 
{
background: #000000; - tło naszego gadżetu,możemy je zmienić na dowolny kolor,jeśli chcemy aby było przezroczyste wpisujemy transparent.
border-radius: 10px; - zaokrąglone narożniki (jedna wartość odpowiada wszystkim czterem narożnikom) naszego tła,wartość zmienna,wartość wystarczy zmienić na 0 aby zaokrągleń nie było. Jeśli chcemy mieć zaokrąglony każdy narożnik inaczej to zamieniamy tą linijkę na border-radius: 30px 30px 20px 20px - pierwsza liczna to górny lewy narożnik,druga liczba to górny prawy narożnik,trzecia liczba to dolny prawy narożnik,a czwarta to dolny lewy narożnik.
width:280px; - szerokość naszego tła 
}

#wc-searchblackbox1
{
padding:10px; - odpowiada za szerokość naszego tła.
}
Ta część odpowiada za ten element:

#wc-searchblacksubmit1
{
border:1px solid #fff; - grubość ramki,rodzaj ramki,kolor ramki. Rodzaje obramowań: solid - linia ciągła, double - linia podwójna, dashed - linia kreskowana, dotted - linia kropkowana
background: #000; - kolor tła,przycisku wyszukiwania
padding: 5px; - szerokość przycisku 
color:#ffffff; - kolor napisu 
font:14px Times New Roman; - rozmiar i rodzaj czcionki przycisku 
}
Ta część odpowiada za ten element:

#wc-searchblackinput1
{
-moz-border-radius: 10px;
-khtml-border-radius: 10px;  - ta cześć odpowiada za zaokrąglenie narożników
-webkit-border-radius: 10px;
border:1px solid #ffffff; - grubość ramki,rodzaj ramki i grubość ramki 
background:#ffffff; - kolor tła pola wyszukiwania 
padding:5px; - szerokość pola wyszukiwania
color:#888888; - kolor tekstu pola wyszukiwania 
width:178px; - długość pola wyszukiwania
font:14px Times New Roman; - wielkość i rodzaj czcionki wyrazu "wyszukaj..." 
}
</style>
<div id='wc-searchblack1'>
         <form name="input" action="Link do naszego bloga/search"  method="get"  id="wc-searchblackbox1">  - dokładnie ma to wyglądać tak:  
<form name="input" action="http://blonparia.blogspot.com/search"  method="get"  id="wc-searchblackbox1"> 
            <input name="q" id='wc-searchblackinput1' onblur='if (this.value == "") {this.value = "Wyszukaj...";}' onfocus='if (this.value == "Wyszukaj...") {this.value = ""}' type='text' value='Wyszukaj...'/>  - słowo "wyszukaj..." możemy zmienić np na "wpisz czego szukasz" wedle uznania,ważne jest aby było zmienione w 3 miejscach 
            <input id='wc-searchblacksubmit1' type='submit' value='Szukaj'/> - tak samo,możemy zmienić wedle własnego uznania np na search

        </form>
      </div>
3. Klikamy zapisz i nasz gadżet widnieje na naszej stronie
Czytaj dalej »

10 jeździeckich ciekawostek

1 grudnia 2014


Z jeździectwem jestem związana już od jakiegoś czasu (od 15 lat mam styczność z końmi,a od 10 jestem osobą jeżdżącą) dlatego w dzisiejszym poście chce się z wami podzielić dziesięcioma ciekawostkami o jakich się dowiedziałam przebywając w stajni przez te parę lat. Mam nadzieję,że osoby,które nie są związane z jeździectwem zainteresuje taka odmiana.

1. Koń maści siwej w wieku 10 lat robi się całkowicie biały (proces ten zaczyna się od głowy).



2.
Wiek konia rozpoznaje się po zębach.



3. Kuc szetlandzki jest bardzo silny,wytrzymały i mało wymagający,a jego wysokość nie przekracza 95 cm.



4. Koń może obrócić ucho prawie o 180 stopni, zawdzięcza to 16-stoma mięśniami w jego uchu.



5. Koń widzi niemal wszystko dookoła głowy,wyjątkiem jest miejsce tuż przed jego pyskiem i przednimi nogami oraz za zadem,są to tzw martwe pola.



6. Włosy na ogonie odrastają aż dwa lata.



7. Zwisająca dolna warga u koni oznacza znudzenie.



8. Źrebię przychodzi na świat z jedną parą mlecznych siekaczy w górnej szczęce i jedną w dolnej.



9. Klacze karmiące rozpoznają swoje źrebie po zapachu.



10. koń nie posiada odruchu wymiotnego.


Wszystkie zamieszczone zdjęcia w poście są mojego autorstwa i zostały wykonane w 2010-2014 roku. Zdjęcia koni zostały wykonane aparatem FUJIFILM FinePix s6500 fd 

Czytaj dalej »