Kody CSS

Instrukcje, z których korzystam...

Jak wiadomo, każdy element na blogu ma swoją nazwę, przykładowo:

post:
.post {przykładowy tekst;}

komentarze:
.comment p {przykładowy tekst;} 

avatary w komentarzach:
.avatar-image-container {przykładowy tekst;}

kolumny:
(lewa)
.main inner .column-left-inner {przykładowy tekst;}
(prawa)
.main inner .column-right-inner {przykładowy tekst;} 

strony/górne menu:
(scalone)
.tabs-outer {przykładowy tekst;}
(oddzielne)
.tabs-inner .widget li a {przykładowy tekst;} 

Polecenia:
Poniżej znajdują się polecenia, które wpisujemy w miejsce "przykładowego tekstu" powyżej.
Dla przykładu, kody CSS na podstawie lewej kolumny (dla prawej zmieniamy jedynie left na right).
(Tekst niepogrubiony zastępujemy własnym)

Tła:
a) kolor:
.main-inner .column-left-inner {background-color: #6C6666;}
b) obrazek w tle:
.main-inner .column-left-inner {background-image: url(link do obrazka);} 

Przezroczystość tła:

.main-inner .column-left-inner {opacity: 0.7;}

Zaokrąglone rogi:

.main-inner .column-left-inner {border-radius: 80px 80px 5px 5px;} 

Przesunięcie:

.main-inner .column-left-inner {margin: 10px 30px 100px 44px;}  

Obramowanie:

a) linia ciągła:
.main-inner .column-left-inner {border-style: solid;}
b) linia podwójna:
.main-inner .column-left-inner {border-style: double;}
c) linia kreskowa:
.main-inner .column-left-inner {border-style: dashed;}
d) linia kropkowana:
.main-inner .column-left-inner {border-style: dotted;} 

Grubość obramowania:

a) cienkie:
.main-inner .column-left-inner {border-width: thin;}
b) średnie:
.main-inner .column-left-inner {border-width: medium;}
c) grube:
.main-inner .column-left-inner {border-width: thick;}

Kolor obramowania:

.main-inner .column-left-inner {border-color: #ffffff;} 

Cienie:

a) tekstu:
.main-inner .column-left-inner {text-shadow: 2px 2px 5px #5a5555;}
b) ramki: 

.main-inner .column-left-inner {box-shadow: 0px 0px 2px black;}

Marginesy:

.main-inner .column-left-inner {padding: 15px;}

Menu/Strony scalone
Odstępy między linkami:
.tabs-outer .widget li a {margin: 10px 5px 5px;}

Długość menu:

.tabs-outer {width: 640px;}

Inne przydatne kody:
Wysokość nagłówka:
.header { height: 670;}

Wysokość lewej kolumny:
.column-left-inner {margin-top: -20px}

Wysokość prawej kolumny:
.column-right-inner {margin-top: -20px}

Wyśrodkowanie daty:
h2.date-header {text-align: center;} 

Wyśrodkowanie tytułu notki:
h3.post-title, .comments h4 {text-align: center;} 

Wyśrodkowanie gadżetów w lewej kolumnie:
.column-left-inner {text-align: center; } 

Wyśrodkowanie gadżetów w prawej kolumnie:
.column-right-inner {text-align: center; }

Wyśrodkowanie górnego menu:
#PageList1 ul {text-align: center;}
#PageList1 ul li { float: none;
display: inline; } 

Rozjechane litery w linku:
a:hover { letter-spacing: 3px; } 

Usunięcie napisów „Starszy post”, „Nowszy post”:
.blog-pager { display: none !important;}

Kredyty:
[Tajemniczy ogród]
[by Elfaba]