Jak upiększyć tytuł posta - Blogger
Zapewne większość z Was zastanawia się jak upiększyć tytuł posta, by był zgrany z całością szablonu i przyciągał uwagę :)
Przydadzą nam się tutaj kody CSS :)
Wchodzimy w Szablon->Dostosuj->Zaawansowane->Dodaj arkusz CSS.
Za zamiany w tytule posta odpowiada h3.post-title. Jednak należy mieć na uwadze, że zamiast h3 może to być h1 lub h2. U mnie jest to właśnie h2.
W pole "dodaj arkusz CSS" wpisujemy:
h3.post-title { kod, który chcemy wykorzystać }
h3.post-title { kod, który chcemy wykorzystać }
Na przykład: h3.post-title {text-transform: uppercase;}
Jeśli chcemy użyć kilku efektów, to w nawiasie wpisujemy kolejne linijki kodu, oddzielając je średnikiem, np.
h3.post-title {
text-transform: uppercase;
text-decoration: underline;
}
Wyjdzie nam coś takiego:
Wyjdzie nam coś takiego:
Czarodziejskie kody, które możecie wykorzystać:
Czcionka, np.: font-family: 'Arial';
font-size: 12 px;
Wielkie litery: text-transform: uppercase;
Małe litery: text-transform: lowcase;
Zawsze wielka pierwsza litera: text-transform: capitalize;
Podkreślenie: text-decoration: underline;
Przekreślenie: text-decoration: line-through;
Nadkreślenie: text-decoration: overline;
Cień: text-shadow: 2px 2px 2px black;
(text-shadow: przesunięcie w poziomie, przesunięcie w pionie, rozmycie, kolor)
Ramka: border: 2px solid black;
(border: grubość, styl, kolor)
Można też zmieniać pojedyncze strony ramki:
border-top: - góra
border-bottom: - dół
border-left: - lewo
border-right: - prawo
Mamy wtedy, np: border-top: 2px solid black
Różne style:
solid - zwykła
dotted - kropkowana
dashed - paskowana
double - podwójna
groove, ridge, inset oraz outset - różne 3D
Mamy wtedy, np:
border: 2px groove black;
border-bottom: 1px double white;
Polecam samemu się pobawić i spróbować różnych efektów :)
Możecie zerknąć jak to zrobiłam na mojej drugiej stronie :)
0 komentarze:
Prześlij komentarz