Jak dodać graficzne pełne tło, za tytułem wpisu

01.12.2016


Pewnie każdy z nas wie, że dodanie tła do tytułu wpisu na Bloggerze kończy się tym, że po prostu mamy kolorowy pasek. Nie wygląda to zbyt atrakcyjnie jeśli mieliśmy naprawdę jakąś ciekawą grafikę, a została nam ona przycięta. Dla tych co nie wiedzą o czym mówię, zdjęcie poniżej:


W dzisiejszym wpisie pokażę Wam, jak zachować naszą grafikę za tytułem wpisu w pełnej okazałości, a zrobimy to wszystko za pomocą kodu CSS.


Przechodzimy do szablon - dostosuj - zaawansowane - dodaj arkusz CSS i wklejamy tam taki kod:

h3.post-title, h3.post-title a {
position: relative;
text-align: left;
background-image:url('LINK DO OBRAZKA');
background-position: -3px;
background-repeat:no-repeat;
padding: 20px 0;
color:#000;
}

Analiza


h3.post-title, h3.post-title a {
position: relative;
text-align: left;
background-image:url('LINK DO OBRAZKA');
background-position: -3px;
background-repeat:no-repeat;
padding: 20px 0;
color:#000;}

Położenie tytułu wpisu 
Położenie obrazka 
Marginesy wewnętrzne 
Kolor tytułu wpisu 

Efekt


Wyśrodkowany tytuł wpisu 


Tytuł wpisu po lewej stronie




Wymiar mojej grafiki to 395x100px

2 komentarze:

  1. I kolejna, niby prosta rzecz, ale jednak trzeba wiedzieć, co i jak. Dzięki!:)

    OdpowiedzUsuń
  2. A to ciekawe :) Fajnie można urozmaicić wpisy :)

    OdpowiedzUsuń

- Komentarze takie jak: spam, obserwacja za obserwacje, prośby o klikanie w banery etc. zostają usuwane - ZAPAMIĘTAJ! MÓJ BLOG TO NIE TABLICA OGŁOSZEŃ
- Uznaje tylko konstruktywną krytykę
- Każdy komentarz to motywacja dla mnie.
- Weryfikacja obrazkowa wyłączona