phpBB2 by Przemo
Support forów phpBB2 modified by Przemo

FAQFAQ - PIERWSZA POMOC!!  regulaminREGULAMIN  SzukajSZUKAJ  UżytkownicyUżytkownicy  GrupyGrupy  StatystykiStatystyki
RejestracjaRejestracja  ZalogujZaloguj  DownloadDownload  katalog Forów DyskusyjnychKatalog Forów   FAQ Video tutoriale

Poprzedni temat «» Następny temat
Przesunięty przez: joli
14-01-2008, 20:08
MENU Podświetlenie menu w SAPHIC
Autor Wiadomość
maniocek

Pomógł: 30 razy
Posty: 401
Wysłany: 18-04-2007, 17:43   MENU Podświetlenie menu w SAPHIC

Witam!

Założyłem wcześniej o tym temat ale to dotyczy innego stylu i tamta metoda nie skutkuje...

Posiadam przerobiony styl Saphic.
I chciałbym zmienić podświetlanie w nim lecz niestety mi nie wychodzi :P

Oto kawałek kodu.

Kod:
/* General text */
.gen { font-size : 11px; }
.genmed { font-size : 10px; }
.gensmall { font-size : 10px; }
.gen,.genmed,.gensmall { color : #000000; }
a.gen,a.genmed,a.gensmall { color: #565037; text-decoration: none; }
a.gen:hover,a.genmed:hover,a.gensmall:hover    { color: #A1BA23; }

.nav1 { height: 23px; vertical-align: middle; background: url(images/cellpic2.gif); padding: 0; margin: 0; }
.nav_top { color: #4F4F4F; padding: 0; margin: 0; }
.nav_top li {  float: center; display: inline;  }   
.nav_top a:link, .nav_top a:visited { float: center; font-size: 11px;  font-weight: bold;    padding: 4px 8px 6px 8px; text-decoration: none; color: #EEEEEE; }
.nav_top a:link.active, .nav_top a:visited.active, .nav_top a:hover { color: #FFFFFF; background: url(images/cellpic3.gif); }

/* The register, login, search etc links at the top of the page */
.mainmenu        { font-size : 11px; color : #000000 }
a.mainmenu        { text-decoration: none; color : #444444; }
a.mainmenu:hover { color:#A1BA23; text-decoration:none; }

/* Forum category titles */
.cattitle        { font-weight: bold; font-size: 10px ; letter-spacing: 1px; color : #4F4F4F}
a.cattitle        { text-decoration: none; color : #4F4F4F; }
a.cattitle:hover    { text-decoration: underline; }



Załanczam cały plik.

MatINet.rar
MatINet.css
Pobierz Plik ściągnięto 1316 raz(y) 2,83 KB

Ostatnio zmieniony przez joli 28-01-2008, 10:38, w całości zmieniany 2 razy  
 
     
Gadatliwa Kasia 

   
maniek.a


Pomógł: 14 razy
Posty: 303
Wysłany: 18-04-2007, 18:32   

Nie rozumiem, chodzi ci o to ?
Cytat:
Cytat:
Ponizszy tutorial zostal napisany na podstawie klas zawartych w stylu subSilver. Moga wystapic drobne roznice w stosunku do innych stylow. W miejscu zaznaczonym na czerwono wpisujemy interesujaca nas wartosc. Caly ten tekst dotyczy zawartosci pliku xxx.css, gdzie xxx to nazwa stylu. Klasy, ktore nie zostaly uwzglednione ponizej nie sa dla poczatkujacego zbyt istotne i nie beda niezbedne przy tworzeniu stylu.


background-color: #E5E5E5; - kolor tla forum

Klasy zaczynajace sie od slowa "scrollbar" odpowiadaja za pasek przewijania, dzialaja pod IE.
scrollbar-face-color: #DEE3E7; - kolor paskow przewijania
scrollbar-highlight-color: #FFFFFF; - kolor cienia na pasku przewijania
scrollbar-shadow-color: #DEE3E7; - kolor cienia pod paskiem przewijania
scrollbar-3dlight-color: #D1D7DC; - obrys gornej i lewej krawedzi paska przewijania
scrollbar-arrow-color: #006699; - kolor strzalki do przewijania
scrollbar-track-color: #EFEFEF; - kolor toru pod paskiem przewijania
scrollbar-darkshadow-color: #98AAB1; - obrys dolnej i prawej krawedzi paska przewijania

background-image: url(); - Pozwala nam ustawic dowolny obrazek jak tlo forum. Sciezke do obrazka wpisujemy w nawiasach.

margin: 4px; - Okresla w pikselach odleglosc samej w sobie tabeli forum od gory i dolu strony.

font,th,td,p { font-family: Verdana, Arial, Helvetica, sans-serif } - Sa to glowne czcionki forum. Na komputerze bez zainstalowanej czcionki bedzie ona zastepowana przez nastepna zawarta w klamrach.

a:link,a:active,a:visited { color : #006699; } - kolory linkow na forum odpowiednio: samego linku, linku aktywnego i odwiedzonego linku

p, td { font-size : 11px; color : #000000; } - rozmiar i kolor czcionki glownie tekstu w PA oraz tego uzywanego w zwyklych, inaczej niezdefiniowanych w css tabelach przykladowo stworzonych w postach

a:hover { text-decoration: underline; color : #DD6900; } - styl oraz kolor linkow po najechaniu na nie myszka

hr { height: 0px; border: solid #D1D7DC 0px; border-top-width: 1px; } - parametry html'owej linii oddzielajacej, znajdziemy ja przykladowo w widoku profilu nad polem podpisu

.bodyline { background-color: #FFFFFF; border: 1px #98AAB1 solid; } - Pierwszy kolor odpowiada za wypelnienie tla wewnatrz tabeli forum. Drugi za kolor i szerokosc w pikselach oraz styl obramowania tej tabeli. Screeny - ( 1,
2 )

.forumline { background-color: #A9B8C2; border: solid #D1D7DC 0px; border-top-width: 1px; } - Pierwszy kolor odpowiada za linie pomiedzy tabelami forum (na czerwono na screenie), drugi kolor (czarny) za dodatkowo dodane wokol tabeli forum linie oraz obramowanie shoutboxa.

td.row1,td.row2,td.row3 { background-color: #XXXXXX; } - Sa to 3 najczesciej uzywane na forum tabelki. Mimo, ze sa oddzielnie to napisalem tutaj jako jedna, poniewaz schemat wszystkich 3 wyglada tak samo. Najlepiej to widac na screenie. row1 zaznaczone jest na czerwono, row2 na zielono, row3 na niebiesko. Trzeba zaznaczyc, ze row1 i row2 sa rowniez naprzemiennie tlami postow.

td.row_helped { background-color: #F0EDDE; } - kolor, jaki bedzie mial post po daniu punktu pomogl.

td.rowpic { background-color: #FFFFFF; background-image: url('images/cellpic2.jpg'); background-repeat: repeat-y; height: 22px;} - Belka na prawo od belki z glowna kategoria forum, standardowo jest tam cellpic2. Mozemy zamienic go inna belka edytujac background-image lub go wyrzucic i ustawic w to miejsce sam kolor. Za pomoca repeat-x lub y definiujemy czy image ma sie powtarzac w pionie czy w poziomie.

th { color: #FFA34F; font-size: 11px; font-weight: bold; background-color: #006699; height: 25px; background-image: url(images/cellpic3.gif) ; - Standardowo gorna, niebieska belka z naglowkami "Forum", "Tematy", "Posty" i "Ostatni Post". Tak samo jak powyzej belke mozemy oczywiscie zmieniac podajac zamiast cellpic3 sciezke do innego obrazka na serwerze lub zdefiniowac tlo. W przypadku tej belki mozemy ustawic rowniez styl czcionki, jaka bedzie pisany na belce tekst.

td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom { background-image: url('images/cellpic1.gif'); background-color:#D1D7DC; border: #FFFFFF; border-style: solid; height: 28px;} - We wszystkich tych klasach uzyta jest ostatnia forumowa belka, czyli cellpic1. Na stronie glownej jest to belka nad shoutboxem, z glowna kategoria forum i z "kto jest na forum". W viewforum i viewtopic jest to belka pod tematami i postami. Stosowane sa w wiekszosci stron forum.

th.thCornerL,th.thTop,th.thCornerR {color: #FFA34F; font-size: 70%; font-weight: bold; background-color: #006699; background-image: url('images/cellpic3.gif'); height: 28px; } - Pozwala nam ustawiac tlo kolejnych belek i uzyte na nich czcionki. Sa to odpowiednia lewa, srodkowe i prawa czesc belki w viewforum.

td.spaceRow { background-color: #D1D7DC; border: #FFFFFF; border-style: solid; } - Pozwala nam zdefiniowac kolor i ramke wokol paska bedacego przerwa pomiedzy postami. Widac na screenie.

th.thHead,td.catHead { font-size: 12px; border-width: 0px; }
th.thSides,td.catSides,td.spaceRow { border-width: 0px; }
th.thRight,td.catRight,td.row3Right { border-width: 0px; }
th.thLeft,td.catLeft { border-width: 0px; }
th.thBottom,td.catBottom { border-width: 0px; }
th.thTop { border-width: 0px; }
th.thCornerL { border-width: 0px; }
th.thCornerR { border-width: 0px; }
^Caly powyzej wydzielony fragment pozwala sprecyzowac grubosc obramowan wokol odpowiednio podanych belek. Tutaj przykladowy efekt.

.maintitle {font-weight: bold; font-size: 22px; font-family: "Trebuchet MS",Verdana, Arial, Helvetica, sans-serif; text-decoration: none; line-height : 120%; color : #000000;} - Standardowo jest to napis "Nazwa twojego forum" na gorze forum. Mozemy kolejno okreslic wyglad czcionki, jej rozmiar, rodzaj, dekoracje, odleglosc od gornej tabeli forum oraz kolor.

.gen { font-size : 12px; } - Rozmiar czcionki odpowiadajacy za "Krótki tekst opisujacy twoje forum".

.genmed { font-size : 11px; } - Rozmiar czcionki na stronie glownej przykladowo opisow kategorii.

.gensmall { font-size : 10px; } - Rozmiar czcionki bardzo duzej ilosci tekstu na forum. Widac na screenie.

.gen,.genmed,.gensmall { color : #000000; } - Kolor czcionki trzech wyzej wymienionych.

a.gen,a.genmed,a.gensmall { color: #006699; text-decoration: none; } - Kolor linkow u ktorych uzyto powyzszych klas.

a.gen:hover,a.genmed:hover,a.gensmall:hover { color: #DD6900; text-decoration: underline; } - Kolor tych linkow po najechaniu na nie myszka.

.mainmenu { font-size : 11px; color : #000000 } - Rozmiar i kolor czcionki tekstu uzytego w naglowku forum. Rowniez odnosnika do shoutboxa.

a.mainmenu { text-decoration: none; color : #006699; } - Rozmiar i kolor czcionki linku w naglowku forum.

a.mainmenu:hover { text-decoration: underline; color : #DD6900; } - Rozmiar i kolor czcionki linku po najechaniu myszka w naglowku forum.

.cattitle { font-weight: bold; font-size: 12px ; letter-spacing: 1px; color : #006699} - Klasa okreslajaca napisy "Glówna kategoria forum" oraz "Kto jest na Forum". Oczywiscie pozwala nam zmieniac czcionke.

a.cattitle { text-decoration: none; color : #006699; } - Klasa okreslajaca linki "Glówna kategoria forum" oraz "Kto jest na Forum".

a.cattitle:hover { text-decoration: underline; } - Klasa okreslajaca linki "Glówna kategoria forum" oraz "Kto jest na Forum" po najechaniu myszka.

.forumlink { font-weight: bold; font-size: 12px; color : #006699; } - Nazwy kategorii subfor.

a.forumlink { text-decoration: none; color : #006699; } - Nazwy kategorii subfor bedace linkami.

a.forumlink:hover { text-decoration: underline; color : #DD6900; } - Nazwy kategorii subfor bedace linkami po najechaniu myszka.

.nav { font-weight: bold; font-size: 11px; color : #000000;} - Odpowiada za czcionke na pasku nawigacyjnym, ktorego opis zaczyna sie od strony glownej poprzez kategorie a konczy sie na temacie. Standardowo rozdzielone pomaranczowymi strzalkami. Uzyte rowniez przy panelu moderatora.

a.nav { text-decoration: none; color : #006699; } - Styl linkow w panelu nawigacyjnym.

a.nav:hover { text-decoration: underline; } - Styl linkow w panelu nawigacyjnym po najechaniu na nie myszka.

.topictitle { font-weight: bold; font-size: 11px; color : #FFFFFF; } - Tekst uzyty w tytule tematow.

a.topictitle:link { text-decoration: none; color : #006699; } - Tytul tematu
bedacy linkiem.

a.topictitle:visited { text-decoration: none; color : #5493B4; } - Odwiedzony odnosnik do jakiegos tematu.

a.topictitle:hover { text-decoration: underline; color : #DD6900; } - Styl tematu po najechaniu na jego nazwe myszka.

.name { font-size : 11px; color : #000000; text-decoration: none} - Odpowiada za wyswietlanie nicku uzytkownika miedzy innymi w viewtopic i w skrzynce z prywatnymi wiadomosciami. Do edycji oczywiscie rozmiar i kolor czcionki i ewentualne podkreslenie, pogrubienie itp.

.postdetails { font-size : 10px; color : #000000; } - Czcionka, jaka zostaly napisane szczegoly o poscie. Miedzy innymi kiedy user dolaczyl, skad pochodzi, data urodzenia itd. Klasa odpowiada rowniez za date i nazwe tematu zawarte nad postem.

.postbody { font-size : 12px; line-height: 18px } - Odpowiada za czcionke, jaka napisane zostaly posty.

a.postlink:link { text-decoration: none; color : #006699 } - Kolor i dekoracja linkow zawartych w postach oraz w shoutboxie.

a.postlink:visited { text-decoration: none; color : #5493B4; } - Kolor i dekoracja odwiedzonych linkow zawartych w postach oraz w shoutboxie.

a.postlink:hover { text-decoration: underline; color : #DD6900 } - Kolor i dekoracja linkow zawartych w postach oraz w shoutboxie po najechaniu na nie myszka.

.code {font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600; background-color: #FAFAFA; border: #D1D7DC; border-style: solid; border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; } - W taki sam sposob jak w klasach poprzednich pozwala nam poustawiac wszystkie parametry dotyczace tekstu oraz ramki stworzonych po uzyciu na forum bbcode'owej funkcji [code ][/code].

.quote {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%; background-color: #FAFAFA; border: #D1D7DC; border-style: solid; border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; } - Tutaj mozemy ustawic jak ma wygladac ramka cytowania po uzyciu na forum bbcode [ quote ][ /quote ].

.copyright { font-size : 10px; color: #444444; font-family: Verdana, Arial, Helvetica, sans-serif; } - Odpowiada za wyglad tekstu uzytego w stopce. Zaznaczone na screenie trzema kolorami, zeby bylo widac.

a.copyright { text-decoration: none; color : #006699; } - kolor i styl linkow w stopce

a.copyright:hover { text-decoration: underline; color : #DD6900; } - kolor i styl linkow w stopce po najechaniu na nie myszka

input,textarea, select {color : #000000; font: normal 11px Verdana, Arial, Helvetica, sans-serif;} - Odpowiada za tekst uzyty w polu wpisywania posta, wiadomosci do shoutboxa, rozwijanych jumpboxach i na przyciskach zatwierdzajacych.

input.post, textarea.post, select { background-color : #EFEFEF; } - Kolor tla pola wpisywania posta, wiadomosci w shoutboxie, rozwijanych jumpboxow i przyciskow zatwierdzajacych.

input.post2, textarea.post2, select { background-color : #DEE3E7; } - kolor tla uzupelniajacych jumpboxow i przyciskow

input { text-indent : 2px; } - wciecie przed pierwsza litera tekstu w inputach

input.button {background-color : #EFEFEF; color :#000000; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; cursor: pointer;} - Pozwala nam ustalic kolor tla i czcionke zawarta na niektorych przyciskach forum. Miedzy innymi przycisk wyslania wiadomosci w shoutboxie i przyciski bbcode.

input.mainoption { background-color: #FAFAFA; font-weight: bold; cursor: pointer; } - Ustawienia dla glownego przycisku zatwierdzajacego. Miedzy innymi "Podglad" i "Wyslij".

input.liteoption { background-color: #FAFAFA; font-weight: normal; cursor: pointer; } - Odpowiada za niepogrubione glowne przyciski zatwierdzajace.

.helpline { background-color: #DEE3E7; border-style: none; } - Kolor tla paska z pomoca znajdujacego sie na stronie pisania nowej wiadomosci. Najlepiej ustawic kolor taki sam jak tla.

span.badwordhighlight { background-color: #FFFF00; } - Odpowiada za kolor podswietlenia slow ustawionych w PA do ocenzurowania. Widzi tylko admin.

.table0
{ background-color : #EFEFEF;
border-bottom-color : #dedede;
border-bottom-style : solid;
border-bottom-width : 1;
border-left-color : #fefefe;
border-left-style : solid;
border-left-width : 1px;
border-right-color : #dedede;
border-right-style : solid;
border-right-width : 1px;
border-top-color : #fefefe;
border-top-style : solid;
border-top-width : 1px;
color : #000000;
font-size : 10px; }

^ Powyzszy fragment odpowiada za kolor, grubosc i styl obrysow tabel w shoutboxie. Opis jest normalnie po angielsku, czyli, bottom odpowiada za dolna krawedz, top za gorna, left za lewa, right za prawa.


.pagination { color: #666; font-size: 10px; font-weight: bold; padding: 3px; padding-bottom: 4px; cursor: pointer; text-decoration: none; } - Pozwala nam okreslac wyglad panelu przejscia do danej strony w tematach, w ktorych jest wiele stron. Mozemy zdefiniowac rozmiar, kolor i styl czcionki, rodzaj kursora oraz odleglosc od tabeli forum.

.pagination a, .pagination a:visited, .pagination a:active, .pagination a:hover { background-color: #EAEBEB; color: #000; border-color: #D4D7DA; border: #D4D7DA 1px solid; padding: 1px; text-decoration: none; } - Dotyczy dokladnie tego samego, co wyzej, lecz odnosi sie do linkow, linkow odwiedzonych, linkow aktywnych i linkow po najechaniu myszka w polu paginacji.
 
     
joli
Yollien +Styler



Pomógł: 2988 razy
Posty: 16981
Wysłany: 18-04-2007, 22:38   

maniocek, po pierwsze, co chcesz podswietlac? Tabele?
Odpowiedź na Twoje pytanie znajduje sie w
F.A.Q. dla stylów


maniek.a, tego nie ma w cssie, a Ty nie musisz wklejać tu całego tutoriala, skoro wystarczy wejsc do FAQ styli.


joli napisał/a:
Kolory podświetlenia tabel zmieniamy w pliku theme_info.cfg – to opcje:
$subSilver[0]['faonmouse_color'] = "DEE3E7";
$subSilver[0]['faonmouse2_color'] = "EFEFEF";
_________________
Walczę z warezami. Więc jak masz forum warezowe, nie proś mnie o pomoc i nie wchodź pod rękę, bo zniszczę.
Nie pisz do mnie na GG i PW,(chyba że proszę) bo nie odpowiem, a Ty dostaniesz bonusik. Masz forum do zadawania pytań!!! Poza forum pomagam TYLKO odpłatnie.
liberte d'expression pour tout le monde... OFICJALNY DOWNLOAD STYLÓW - style ogólnodostępne i na zamówienie - PORTFOLIO JOLI
 
     
maniocek

Pomógł: 30 razy
Posty: 401
Wysłany: 19-04-2007, 06:16   

O kurczę :P

Przepraszam zapomniałem napisać.. .


Chciałbym zmienić podświetlanie menu...
Założyłem o tym już wcześniej temat ale tamta metoda jakoś nie skutkuje.
 
     
joli
Yollien +Styler



Pomógł: 2988 razy
Posty: 16981
Wysłany: 19-04-2007, 07:47   

No tak.. Bo tu podswietleniem jest obrazek...
Jednak w css musisz zmienic, choc w standartowych opisach tego nie ma:
Kod:
.nav_top a:link.active, .nav_top a:visited.active, .nav_top a:hover { color: #FFFFFF; background: url(images/cellpic3.gif); }

na:
Kod:
.nav_top a:link.active, .nav_top a:visited.active, .nav_top a:hover { color: #A1BA25 }
, jesli kolor podswietlenia ma byc taki zielonkawy. Jesli inny no to juz kolor wstaw inny
_________________
Walczę z warezami. Więc jak masz forum warezowe, nie proś mnie o pomoc i nie wchodź pod rękę, bo zniszczę.
Nie pisz do mnie na GG i PW,(chyba że proszę) bo nie odpowiem, a Ty dostaniesz bonusik. Masz forum do zadawania pytań!!! Poza forum pomagam TYLKO odpłatnie.
liberte d'expression pour tout le monde... OFICJALNY DOWNLOAD STYLÓW - style ogólnodostępne i na zamówienie - PORTFOLIO JOLI
 
     
maniocek

Pomógł: 30 razy
Posty: 401
Wysłany: 19-04-2007, 11:32   

Dzięki pomogło :P

Masz +


można zamknąć temat.
 
     
Wyświetl posty z ostatnich:   
Ten temat jest zablokowany bez możliwości zmiany postów lub pisania odpowiedzi
Nie możesz pisać nowych tematów
Nie możesz odpowiadać w tematach
Nie możesz zmieniać swoich postów
Nie możesz usuwać swoich postów
Nie możesz głosować w ankietach
Nie możesz załączać plików na tym forum
Możesz ściągać załączniki na tym forum
Dodaj temat do Ulubionych
Wersja do druku

Skocz do:  

Kopiowanie wszelkich treści zawartych na forum, modyfikacji oraz instrukcji bez zgody administracji i autorów tematów/postów zabronione!

Powered by phpBB modified by Przemo © 2003 phpBB
Strona wygenerowana w 0,08 sekundy. Zapytań do SQL: 15
Polecane serwisy

Najlepsze oprogramowanie do prowadzenia sklepu internetowegoNajlepszy program do sklepu firmowany przez Przem'a

Sklep z gadżetami

mediaclick.pl

serwis laptopów

phpbb

Polisy Ubezpieczeniowe TU Europa

Design Cart - Tworzenie sklepu internetowego

dnirozwoju.pl

Ranking Hostingów HostingOnline.pl

• Zamów reklamę