4. Selektory

W poprzednim poście napisałam czym są selektory. Każdy element bloga ma swoją nazwę, której trzeba się nauczyć. Nie są to wymyślone przeze mnie terminy, nie da się też ich zmieniać, chyba, że sami dodamy jakiś element w HTMLu i nadamy mu nazwę. Na razie jednak skupimy się na tych istniejących, najbardziej popularnych selektorach. 

selektory ogólne

body - cały blog, ten selektor najczęściej służy do ustawienia tła bloga
.navbar - pasek nawigacyjny
vertical - pasek boczny, na którym scrolluje się stronę
scrollbar - pasek przewijania
img - wszystkie zdjęcia na blogu
a.blog-pager-older-link - starsze posty
a.blog-pager-newer-link - nowsze posty
a.home-link - strona główna

nagłówek bloga

.header - nagłówek
h1 - tytuł bloga
.description - opis bloga

strony poziome

.tabs-outer - strony na szerokość całego bloga

.tabs-inner - strony na szerokość wszystkich kolumn

kolumny

.main-inner - wszystkie kolumny

.column-right-inner - prawa kolumna

.column-center-inner - środkowa kolumna

.column-left-inner - lewa kolumna

posty

#Blog1 - kolumna z postami

.post - post

.post-body - treść posta

h2.date-header span - data posta

h3.post-title - tytuł posta

.post-body img - zdjęcia w poście

blockquote - cytat

b - tekst pobrubiony

i - kursywa

u - podkreślenie

strike - przekreślenie

.jump-link - czytaj dalej

.post-author - autor posta

.comment-link - ilość komentarzy

.post-timestamp - godzina dodania posta

h4 - nagłówek z ilością komentarzy pod postem

komentarze

.comment p - komentarz

.comment-header - nagłówek komentarza z nickiem i datą

.user - nick osoby, która napisała komentarz

.datetime - data komentarza

.avatar-image-container - avatar 

.comments .comment .comment-actions a, .comments .thread-toggle a - odpowiedz i usuń

gadżety

.column-right-inner .widget - wszystkie gadżety w prawej kolumnie

.column-left-inner .widget - wszystkie gadżety w lewej kolumnie

#PageList1 - gadżet ze stronami

#PageList1 a - linki w gadżecie strony

#BlogArchive1 - archiwum bloga

#BlogArchive1 a - linki w gadżecie archiwum

#Stats1 - statystyka

.counter-wrapper - licznik odwiedzin

#Text1 - gadżet z tekstem

#Label1 - etykiety

#Label1 a - linki w gadżecie etykiety

#Followers1 - obserwatorzy

#Image1 - gadżet ze zdjęciem

#Profile1 - gadżet z profilem o mnie

#PopularPosts1 - popularne posty

Same selektory nic nie dają. Potrzebują odpowiednich wartości, które określają ich wygląd, dlatego w następnym poście pokażę wam przykładowe kody z wartościami, które pozwolą nam edytować wypisane powyżej elementy bloga.

Posty pojawiają się bardzo często, bo chciałabym jak najszybciej przedstawić Wam suchą teorie, bo ważną rzeczą jest rozumienie z czym ma się do czynienia. Uwierzcie mi, że dalsza praca będzie o wiele łatwiejsza i przyjemniejsza.