Karty / Strony

(...) czyli to, co przyprawia mnie o ból głowy...

Jest to chyba najgorsza rzecz do ustawienia. Osobiście szczerze tego nienawidzę i mój laptop świadkiem, że nie raz miałam ochotę zrobić coś bardzo złego. Z pomocą Finranthil z Zaczarowanych Instrukcji (niech Cię wszystkie świętości błogosławią) udało mi się uzyskać potrzebne mi efekty.

Początkowy człon kodu na karty (>podgląd<):
.tabs-outer
.tabs-outer .widget li.selected a   - wybrana karta
.tabs-outer .widget li a:hover       - podświetlona karta

Jeśli chcemy, ażeby strony były w osobnych kartach, wtedy zamiast .tabs-outer wpisujemy .tabs-inner .widget li a (>podgląd<)


* Przykładowy wygląd pełnego kodu dla kart (.tabs-outer):  
.tabs-outer {background-color: #E3DCC7;}

* Przykładowy wygląd pełnego kodu dla kart (.tabs-inner .widget li a):  
.tabs-inner .widget li a {background-color: #E3DCC7;}

Kolor tła:  

{background-color: #E3DCC7;}

Obrazek w tle: 

{background-image: url(adres do obrazka);}

Przezroczystość:
.tabs-inner {opacity: 0.7;}

Cienie tekstu: {text-shadow: 2px 2px 5px #000000 }
Cienie ramki: {box-shadow:0px 0px 2px #000000}

Zaokrąglone rogi: {border-radius: 90px 90px 9px 9px;}

Marginesy: {padding: 3px;}

Obramowanie linia ciągła: {border-style: solid;}
Obramowanie linia kreskowana: {border-style: dashed;}
Obramowanie linia kropkowana: {border-style: dotted;}
Obramowanie linia podwójna: {border-style: double;}

Grubość obramowania - cienkie: {border-width: thin;}
Grubość obramowania - średnie: {border-width: medium;}
Grubość obramowania - grube: {border-width: thick;}

Kolor obramowania - {border-color: #ffffff;}

Przesunięcie:
.tabs-outer {margin: 10px 30px 100px 44px;}
Można używać wartości dodatnich i ujemnych.

Odstępy między linkami:
.tabs-outer .widget li a {margin: 4px;}

Długość menu:
.tabs-outer {width: 640px}

W RAZIE PROBLEMÓW Z KOMENDAMI ZALECA SIĘ WPISANIE:

(kody do uzyskania efektu stron w osobnych kartach) >podgląd<

by Finranthil

#PageList1 li {box-shadow:0px 0px 5px #000000;
border-radius: 10px 10px 10px 10px;
background-color:#556B6B;
opacity: 0.9;
padding: 0px;
margin: 10px;
}

Parametry wg uznania.

* Oczywiście do kodu można dopisywać pozostałe efekty, jak np grubość i rodzaj obramowania. Pomijamy jedynie nawiasy.