Projekt każdej witryny opiera się na obrazach tła i kolorach, jak dom na fundamencie. Jeśli chcesz zastąpić typowy fundament swojego zasobu internetowego czymś bardziej indywidualnym, powinieneś zacząć od opracowania projektu. A kiedy będzie gotowy, pozostanie część czysto techniczna, czyli zastąpienie starego projektu tła strony określonego w kodzie źródłowym stron nowym. W praktyce można to zrealizować na kilka sposobów.
Instrukcje
Krok 1
Najpierw musisz dowiedzieć się, w jaki sposób tło jest ustawione w aktualnej wersji witryny. Aby to zrobić, otwórz kod HTML strony. Możesz to zrobić za pomocą prostego edytora tekstu, pobierając wcześniej plik z serwera. Możesz też skorzystać z edytora stron systemu zarządzania treścią, jeśli z niego korzystasz. Edytor stron nie wymaga pobierania pliku, ale modyfikuje go bezpośrednio na serwerze za pomocą przeglądarki jako interfejsu. Kod HTML (HyperText Markup Language) otwieranej strony składa się z linii instrukcji dla przeglądarki. Opisują typy, wygląd i położenie każdego z elementów strony internetowej. Instrukcje te są powszechnie określane jako „znaczniki”. Kolejność samych tagów w kodzie strony jest również zgodna z regułami języka HTML – są one podzielone na bloki, z których pierwszy musi być blokiem nagłówka, który zaczyna się od tagu i kończy. Po nim powinien następować blok, który cię teraz bardziej interesuje - treść dokumentu. Ogranicza się do tagów i. W otwierającym tagu tego bloku () możesz umieścić informacje o tle strony. Takie informacje w tagach nazywane są „atrybutami”. Atrybut tagu body, który ustawia kolor tła, jest oznaczony jako bgcolor iw kodzie może wyglądać tak: Tutaj ustawiamy kolor tła strony na srebrny. Przeglądarka rozpoznaje niektóre kolory po ich nazwach, ale aby się nie pomylić, lepiej podać ich kody szesnastkowe. Ta wersja ze srebrnym kolorem w wyrażeniu szesnastkowym będzie wyglądać tak: Musisz więc znaleźć tag zaczynający się od <body w kodzie strony i sprawdzić, czy ma on kolor tła. Jeśli tak, zastąp oznaczenie koloru w nim nową wersją i zapisz zmiany na stronie.
Krok 2
Tło w obecnym projekcie witryny można ustawić nie według koloru, ale za pomocą obrazu. Odpowiedni atrybut tagu body nazywa się background i może wyglądać w kodzie tak: Tutaj tło to obraz bg.jpg
Krok 3
Opisując wygląd stron o stosunkowo złożonej konstrukcji, używaj „kaskadowych arkuszy stylów” – CSS (Cascading Style Sheets). Bloki kodu CSS mogą być zawarte bezpośrednio w kodzie strony lub zawarte w zewnętrznym pliku z rozszerzeniem „css”. Musisz poszukać tagu opisu stylu zaczynającego się od <style w nagłówku kodu strony (pomiędzy tagami i). Jeśli zawiera łącze do zewnętrznego pliku, będzie wyglądać mniej więcej tak: @import „style.css” Oto łącze do arkusza stylów o nazwie style.css. Musisz otworzyć określony plik do edycji. A jeśli nie ma linku, a po otwierającym tagu <style znajdują się instrukcje dotyczące stylu, to musisz je tutaj edytować. W obu opcjach, wśród opisów stylów, należy poszukać tych związanych z treścią dokumentu (body). Ten blok opisów może wyglądać tak: body {
kolor tła: srebrny;
kolor czarny;
} Tutaj musisz zastąpić wartość parametru background-color wartością nowego koloru i lepiej tymi samymi wartościami szesnastkowymi. Opcja obrazu tła w instrukcjach CSS powinna wyglądać tak: body {
tło: # C0C0C0 url (img / bg.jpg) powtórz-y;
kolor czarny;
} Tutaj link do obrazka jest podobny do tego omówionego powyżej, a #C0C0C0 przed linkiem oznacza, że przestrzeń strony, która nie jest zajęta przez obraz tła, będzie miała srebrne tło. „Powtórz-y” oznacza, że obraz tła powinien zostać pomnożony wzdłuż osi Y (pionowej).„Repeat-y” można zastąpić „repeat-x” (replikacja pozioma) lub „no-repeat” (nie powielaj). Jeśli w ogóle nie określisz powtarzania, obraz tła zostanie umieszczony obok obszaru tła strony we wszystkich kierunkach.
