Jak zmienić wygląd księgi gości?
Chcesz aby w Twojej księdze gości linki miały określony kolor, albo aby litery były
większe? Wystarczy, że wyedytujesz w panelu administracyjnym styl CSS a księga będzie
miała odpowiedni wygląd. Poniżej przedstawiam domyślny styl CSS a także krótki
samouczek który wyjaśni jak się edytuje style CSS
<wkrótce w tym miejscu zamieszcze pare gotowych szablonów>
Domyślny styl CSS (przyda się, gdy stwierdzisz, że oryginalna księga
gości wygląda lepiej niż ta po Twoich modyfikacjach)
Oto krótkie opisy poszczególnych sekcji
body { ... }- tutaj zdefiniowałem domyślny rozmiar czcionki (12
punktów) i nazwę czcionki (Verdana, jak nie ma Verdany to Arial, jak nie ma Verdany i
Araiala to Helvetica itp.)
h1 { ... }- tutaj określiłem domyślny rozmiar czcionki dla nazwy
księgi gości
.czas {...} - tutaj jest wygląd napisu: Data wpisu
.czas2 { ... } - tutaj jest wygląd daty wpisu
.ip {..} i .ip2 {...} - tutaj zdefiniowałem kolor IP
osoby wpisującej się do księgi gości (IP jest widoczny dopiero po zalogowaniu się)
.numer { .. } - tutaj zdefiniowałem kolor, wielkość i krój
czcionki w numerach wpisów (1, 2, 3 itp.)
.tresc { .. } - tutaj są zdefiniowane parametry czcionki tekstu który
zostawił odwiedzający księgę gości (treść wpisu)
A:link i podobne - tutaj jest zdefiniowany wygląd linków
Jak wyedytować styl?
Jeśli zapoznałeś się z informacjami, z jakich sekcji składa się styl (czyli
wygląd jakich elementów można edytować) to możesz przystąpić do edycji stylu CSS.
Może edytowanie styli jest trudniejsze niż korzystanie z jakiegoś kreatora, gdzie się
wybiera np. jeden spośród kilku dostępnych kolorów, ale za to daje większe
możliwości. Poniżej opiszę podstawy stylu CSS tak abyś mógł bez problemu zmienić
kolory na stronie startowej. Jeśli chcesz dogłebnie poznać style CSS to odsyłam Ciebie
do literatury informatycznej, tutaj podam tylko podstawy.
Więc każda sekcja składa się z nazwy (np.h1) i nawiasów
klamrowych { i }. Nawiasy klamrowe oznaczają gdzie zaczyna się i gdzie się kończy opis
danej sekcji. Na logikę przypatrzmy się temu fragmentowi:
h1 {
font-size: 16px;
}
Oznacza to, że opis sekcji body składa się tylko z jednej linijki font-size:
16px; Jeśli byś chciał coś dopisać (np. zdefiniować kolor czcionki) to
musiałbyś dopisać jakąś linijkę pomiędzy nawiasami klamrowymi. Zauważ, że opis
sekcji body składa się aż z 2 linijek i są one zapisane pomiędzy
nawiasami klamrowymi. Te nawiasy oznaczają skąd do kąd przeglądarka internetowa ma
czytać definicje wyglądu danej sekcji. Zauważ, że każda sekcja ma jeden nawias
otwierający i jeden zamykający, nie ma nigdzie opisu wyglądu, który by nie był w
jakimś nawiasie klamrowym. Każda linijka opisu kończy się średnikiem.
Załóżmy, że chcemy zmienić kolor czcionki daty wpisu. W opisie wyczytaliśmy, że
odpowiada za to sekcja .czas2. Oto definicja wyglądu nagłówka modułu:
.czas2{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #800000;
}
Opis jest dość długi, składa się aż z 3 linijek. W pierwszej linijce informujemy
przeglądarkę internetową jaka czcionka ma być użyta (podałem kilka nazw, gdyż gdyby
oglądający stronę nie miał czcionki Verdana to wtedy komputer skorzysta z czcionki
Arial itp.). W drugiej linijce określiłem rozmiar czcionki a w trzeciej kolor (# i 6
cyfr to kod koloru) W takim dziwnym formacie zapisuje się kolory. Tutaj jest dostępna tabela kolorów. Nie jest ona obszerna, ale w ramach eksperymentu
możesz zmienić kolor. W tym celu ciąg znaków #800000
należy zamienić jakimś innym kodem koloru np. różowym (kod koloru różowego to
#FF80FF). Jeśli próba się udała to powiem coś więcej o kolorach: otóż mamy do
dyspozycji aż 16 milionów kolorów! Owa tabela zawiera tylko kilka najpopularniejszych
kolorów, ale możesz skorzystać z mojego programu KreatorKolorów (6 KB) który potrafi
stworzyć dowolny kolor spośród 16 milionów dostępnych.
W grafice komputerowej każdy kolor można opisać jako składową 3 podstawowych
kolorów (red - czerwony, green - zielony, blue - niebieski). Ten format tworzenia
kolorów nazywa się RGB. Każdy kolor powstaje jakby ze zmieszania ze sobą tych 3
kolorów w dowolnych proporcjach. Każdy z tych 3 kolorów może mieć odpowiednie
nasycenie w skali 0 - 255 (0- brak, 255 max). Zmieszanie tych 3 kolorów daje 16 milionów
kombinacji. W moim programie trzeba po prostu przesuwać suwakami i gdy uzyskasz
odpowiedni kolor to kopiujesz do schowka kod koloru i dokonujesz zamiany.
Mam nadzieje, że to krótkie wprowadzenie pozwoli Tobie na stworzenie ciekawego
szablonu. Nie bój się eksperymentować! Nawet jeśli uznasz, że nie masz zdolności
artystycznych i że domyślna kolorystyka była najlepsza, to masz tutaj dostępny styl
CSS domyślnego szablonu!
Powrót do działu pomoc
Menu główne
