1. Od tej pory będziemy używali języka zwanego HTML, czyli
skrótu od ''HyperText Mark-up Language'' (hipertekstowy język
znaczników). Wszystko będziemy umieszczać właśnie między znacznikami
(bądź też tagami) <html>, a zamykamy je za pomocą tego samego
znacznika dodając tzw. slash: </html>. Niektóre tagi nie
potrzebują jednak, by je zamykać np. br - który oznacza przeniesienie do
nowej linii, gdyż jeśli postawimy enter strona tego nie odczyta. Kod
strony możesz pisać w notatniku lub innych edytorach tekstu, ja
korzystam właśnie z notatnika
<br>
<br>
Utwórz
dla wygody nowy folder o nazwie ''strona'' i w nim umieszczaj wszystko,
co będziesz chciał/a mieć w swojej stronie internetowej. Otwórz także
notatnik.
2. Znamy już podstawy przyszedł czas
na elementy niezbędne do rozpoczęcia pisania strony. Żeby wgl. coś
rozpocząć musimy ''dać znak'', że będziemy pisać w języku HTML, a do
tego posłużą nam te znaczniki:
<html></html>
3.
Super! Teraz już wszystko jasne w jakim języku będziemy pisać naszą
stronę. Podstawowa strona składa się jednak z głowy i ciała dokumentu.
Posłużą nam do tego znaczniki ''head'' oraz ''body'', właśnie od ich
polskich odpowiedników. Te tagi będziemy musieli zamykać. W sekcji
''head'' cokolwiek umieścimy będzie tylko odczytem dla strony, to co
dopiero zobaczy użytkownik będzie znajdowało się w ciele naszej strony:
<head></head> <body></body>
Nasz kod powinien teraz wyglądać następująco:
<html> <head> </head> <body> </body> </html>
4. Pomiędzy znacznikami ''head''
możemy umieścić tagi ''title''. Nada nam on po prostu tytuł strony,
który będzie widoczny w górnej części naszej przeglądarki:
<title></title>
5. Zajmijmy się teraz częścią ''body'', czyli tym, co będzie widoczne dla każdej osoby, która wejdzie na naszą stronę. Wszystko, co opiszę już niżej będziecie musieli właśnie umieszczać pomiędzy tym tagiem. Do znacznika ''body'' możemy dodawać atrybuty np. dodające kolor/tło naszej stronie. Znacznik musimy zmodyfikować w ten sposób:
<body background=tlo.PNG>
Świetnie
prawda? Oczywiście po znaku równości umieszczasz nazwę pliku, którą
masz w tym samym katalogu wraz z stroną lub wklejasz link do obrazka. A
może jednak chcesz tylko kolor? Nic trudnego ''background'' zmieniasz na
''bgcolor'', a po znaku równości wpisujesz nazwę koloru (oczywiście po
angielsku) lub kod z palety:
<body bgcolor=#99bdd3> <body bgcolor=blue>
6. Teraz poznamy znaczniki, które pozwolą nam na małą manipulację naszego tekstu:
<center> Wypośrodkowany tekst </center> <p align=right> Tekst z prawej strony </p>
Jeżeli chcecie go podkreślić, pogrubić lub pochylić użyjecie:
<u> Podkreślenie </u> <b> Pogrubienie </b> <i> Pochylenie </i>
7. Nauczę Cię jeszcze jak wstawić na naszą stronę zwykły obrazek. Potrzebny nam będzie do tego ten znacznik:
<img src=źródło>
''img''
to skrót od image, czyli obraz, a ''src'' to ścieżka dostępu/źródło.
Słowo ''źródło'' zastępujemy nazwą obrazu np. ''tło.PNG''. Ważne,żeby po nazwie za kropką wstawić format (jpg, png, gif, itp.) w jakim zapisany jest nasz obraz, możemy też po prostu wkleić po znaku równości bezpośredni link do obrazu.
8. Ważne też są linki, dzięki którym możesz np. nawigować stronę. Możesz je wstawiać za pomocą tego tagu:
<a href=link>Kliknij tutaj</a>
W
miejscu ''link'' po prostu wklejasz adres strony, na którą ma po
kliknięciu przenosić. Zamiast ''kliknij tutaj'' możesz wstawić dowolny
tekst. Wstawiając zamiast tego tekstu kod obrazka, będziemy mogli
przejść na inną stronę klikając na obrazek.
9. Pozostaje nam tylko zapisanie naszej strony. Tradycyjnie wchodzimy w Plik --> Zapisz jako.
W polu ''zapisz jako typ'' (zaznaczyłam na niebiesko) rozwijamy listę i
wybieramy ''wszystkie pliki''. W polu ''nazwa pliku'' (zaznaczyłam na
czerwono) wpisujemy nazwę naszego pliku, ja użyłam ''index''. Bardzo ważne jest teraz, by po kropce wstawić format naszego dokumentu. W tym wypadku jest to HTML. Nasza nazwa powinna więc wyglądać tak: index.html.<br>
Poradnik wzięty z zaufanej strony :D
