Pobieranie prezentacji. Proszę czekać

Pobieranie prezentacji. Proszę czekać

HTML Język opisu strony www Język HTML (Hypertext Markup Language) należy do grupy języków opisu tekstu, takich jak PostScript, ale pochodzi bezpośrednio.

Podobne prezentacje


Prezentacja na temat: "HTML Język opisu strony www Język HTML (Hypertext Markup Language) należy do grupy języków opisu tekstu, takich jak PostScript, ale pochodzi bezpośrednio."— Zapis prezentacji:

1

2 HTML Język opisu strony www

3 Język HTML (Hypertext Markup Language) należy do grupy języków opisu tekstu, takich jak PostScript, ale pochodzi bezpośrednio od języka SGML (Standard Generalized Markup Language). Powodem, dla którego stworzono SGML, była konieczność łatwego przemieszczania dokumentów DTD (Dokument Type Definition) pomiędzy różnymi środowiskami, a także przenoszenie ich na zupełnie różnych nośnikach. Niezależność od platformy i nośnika została osiągnięta dzięki temu, że w dokumentach SGML jest opisywana jedynie struktura tekstu, a nie jego dokładny wygląd. Niezależność tę przeniesiono również do języka HTML, a to z tego powodu, że w Internecie pracuje ogromna liczba komputerów różnych typów i wyposażonych w różnorodne systemy operacyjne.

4 Język HTML pozwala na odczytywanie dokumentów (stron WWW * ) praktycznie na każdym komputerze i w każdym środowisku; odczytywane są one przez tak zwane przeglądarki. Język HTML nie jest trudny ani do nauczenia się, ani nawet do dobrego opanowania. Na pewno jednak jest dobrym ćwiczeniem w uważnym pisaniu i logicznym myśleniu. Prawdę mówiąc, w kilka minut można napisać i udostępnić prostą stronę HTML.

5 Należy jednak wiedzieć, że różne firmy stosują dla swych przeglądarek pewne rozszerzenia języka HTML. Powoduje to, że niektóre strony WWW - bardzo atrakcyjne - oglądane w jednej przeglądarce, w innej mogą być nieczytelne. Można powiedzieć, że HTML jest językiem Internetu. Popularnie zwany jest on hypertextem, co w wolnym przekładzie znaczy "coś więcej niż tekst". W praktyce między innymi oznacza to, że w swoim dokumencie możesz umieścić odnośniki do innych stron WWW lub innych usług dostępnych w Internecie.

6 Dokument HTML możesz tworzyć używając dowolnego prostego edytora tekstów takiego jak Notatnik dla Windows. Nigdy nie stosuj edytorów formatujących tekst. Formatujesz go posługując się znacznikami HTML. Przed rozpoczęciem pracy musisz mieć wizję przyszłego dokumentu. UWAGA - WAŻNE: Pamiętaj, że dokument HTML musi mieć rozszerzenie HTM lub HTML. np.: Omnie.htm lub Omnie.html Tworzenie dokumentów HTML

7 Znaczniki są niczym innym jak rozkazami umieszczanymi między znakami określającymi w jaki sposób przeglądarka powinna wyświetlać zawartość dokumentu. Dla przeglądarki jest obojętne czy znaczniki wpisywane są wielkimi, czy małymi literami. Większość znaczników występuje parami. Parę taką tworzą znaczniki otwierające np.: i zamykające np.:. Między tymi znacznikami umieszcza się treść, do której one się odnoszą. Przykład: treść objęta znacznikami Zwróć uwagę na brak nadmiernych spacji pomiędzy objętym tekstem a nawiasami trójkątnymi. Znaczniki w języku HTML

8 Wiele znaczników posiada dodatkowe atrybuty, które precyzują wpływ znacznika na objęty tekst. Atrybuty wpisywane są pomiędzy słowo kluczowe a znak >. Stosować można kilka atrybutów do jednego znacznika, pisze się je jeden po drugim oddzielając spacją. Przykład: Tu znacznik posiada atrybut BORDER, określa on dokładniej żądaną funkcję. Atrybut oddzielony jest od znacznika spacją. Atrybuty

9 treść dokumentu Znacznik informuje przeglądarkę, że jest to dokument HTML. Jest on znakiem rozpoczynającym. Natomiast znacznik jest znakiem końca dokumentu HTML. Znaczniki umieszcza się między znakami. Większość znaczników występuje parami, tak jak i. Poniżej przedstawiony jest sposób w jaki należy rozpocząć i zakończyć dokument HTML

10 Poniżej przedstawiony jest ogólny schemat dokumentu HTML treść czołówki treść dokumentu Znaczniki HEAD i BODY Między znacznikiem HEAD a /HEAD umieszcza się informacje między innymi o adresie danej strony, o sposobie kodowania znaków itd. Jedynym elementem widocznym w przeglądarce jest tytuł strony WWW. Sekcja Body dokumentu HTML zawiera właściwą treść, w tym teksty, grafikę i rodzaj formatowania.

11 Tytuł strony i kolor tła Poniżej przedstawiony jest kod źródłowy przykładowego dokumentu. Określenie sposobu kodowania polskich znaków (standard ISO jest ogólnie przyjęty i stosowany w sieci). Nasza Szkoła Tytuł strony - pojawi się on w pasku nazwy przeglądarki (nie w treści stron). Znaczniki mogą mieć atrybuty - tu atrybut bgcolor mający wartość Silver informuje przeglądarkę, w jakim kolorze ma być przedstawione tło dokumentu. Między znacznikami i umieszcza się treść dokumentu.

12 Organizacja strony HTML daje możliwość stosowania aż sześciu poziomów nagłówków. Za pomocą polecenia np. Poniżej przedstawiono fragment kodu źródłowego przykładowego dokumentu zawierającego nagłówki. To jest nagłówek poziomu pierwszego To jest nagłówek poziomu trzeciego To jest nagłówek poziomu szóstego Treść umieszczona na stronie Rady: Nagłówki tworzą strukturę hierarchiczną, należy więc ich używać konsekwentnie. Nagłówek automatycznie kończy akapit, nie ma więc potrzeby jawnego kończenia akapitu.

13 HTML nie rozpoznaje znaków końca linii, wprowadzanych w edytorze tekstów. Aby rozpocząć nowy akapit w dokumencie HTML należy zastosować znacznik. Znacznik ten nie wymaga pary. Rady: Zastosowanie nagłówka oraz linii poziomej również spowoduje rozpoczęcie nowego akapitu i dlatego nie trzeba po nich dodawać znacznika. Początek nowego akapitu

14 Podczas tworzenia nowego akapitu po zastosowaniu znacznika, przeglądarki robią dość duży odstęp. Aby móc zacząć nową linię unikając takich odstępów, należy wykorzystać łamanie linii. W tym celu stosowany jest znacznik. Znacznik ten nie posiada zamykającej pary. Łamanie linii

15 pogrubienie tekstu pochylenie tekstu podkreślenie tekstu przekreślenie tekstu indeks górny indeks dolny tekst pisany czcionką o stałej szerokości (czcionka maszyny do pisania) Wyróżnianie tekstu

16 To jest wycentrowany nagłówek poziomu czwartego Jeśli chcemy wycentrować nagłówek, to należy posłużyć się argumentem align o wartości center. Ten fragment tekstu będzie wyświetlany jako wyśrodkowany. Wycentrowanie normalnego tekstu i. Ten tekst też warto zobaczyć. Ten fragmencik będzie wyświetlanyna środku ekranu. Należy jednak pamiętać, że zastosowanie znacznika powoduje automatycznie rozpoczęcie nowego akapitu, natomiast zakończenie akapitu (czyli początek nowego). Centrowanie tekstu

17 wychowanie, kształcenie jest procesem ciągłym i złożonym. Tekst ten zostanie napisany czcionką o rozmiarze 4 Rady: Znacznika FONT należy używać do zmiany rozmiaru fragmentu tekstu, Nie należy wpisywać tekstu większą czcionką niż nagłówek. Zmiana rozmiaru czcionki wybranego fragmentu tekstu

18 wychowanie, kształcenie jest procesem ciągłym i złożonym. Tekst ten zostanie napisany czarną czcionką o wielkości 3 Rady: Kolory można ustalać za pomocą ich nazwy ( White, Black, Red itd.), lub użyć tak zwanej notacji heksadecymalnej. Tworząc dokument dobieraj odpowiednio kolor tła i tekstu, aby to co piszesz, było czytelne. Zmiana koloru tekstu

19 Tu wstawiony zostanie rysunek (zdjęcie) o nazwie rysunek.jpg, znajdujący się w tym samym katalogu, w którym znajduje się niniejszy dokument. Rady: Wklejaj tylko małe obrazki, aby czas ładowania strony był jak najkrótszy. Jeśli chcesz pokazać duży obrazek, stosuj ikony odsyłające do osobnej strony, na której zamieścisz duży rysunek. Ilustracje wklejone

20 Atrybut BACKGROUND znacznika BODY wskazuje na zbiór zawierający rysunek, który wyświetlany będzie jako tło dokumentu. Rady: Grafikę przygotuj tak, aby tło nie okazało się zbyt "agresywne" - rozjaśnij ją. W celu umieszczenia tekstu na tle jakiegoś deseniu, nie trzeba stosować grafiki o dużych rozmiarach, lecz sensowniej jest przygotować mały element graficzny. Stosując atrybut BACKGROUND, podaj jako jego wartość mały rysunek. Przeglądarka powieli go tak, że wypełni on całość dokumentu. Ilustracja jako tło dokumentu HTML

21 Język znaczników HTML posiada tylko jeden element graficzny. Jest to linia pozioma, którą poprawnie interpretuje większość stosowanych przeglądarek. Linia pozioma pomaga w oddzielaniu od siebie fragmentów tekstu. HR bez atrybutów linia o grubości 1 piksela i długości równej 70% szerokości okna, w którym jest wyświetlana, wyrównana do lewej krawędzi okna, z efektem 3D Wstawianie poziomych linii

22 Tekst zawarty między znacznikami: otwierającym A i zamykającym A, staje się odnośnikiem do strony wskazanej przez wartość atrybutu HREF znacznika A Odsyłacz do strony o nazwie prezentacja, znajdującej się w tym samym katalogu Odsyłacz do strony Ośrodka Edukacji Informatycznej Odsyłacz do skrzynki pocztowej o podanym adresie Odsyłacze do innych dokumentów

23 Poniższy fragment tekstu przedstawia przykład kodu źródłowego HTML umożliwiającego włączenie do dokumentu spisu treści z odsyłaczem do wskazanego miejsca w dokumencie. kotwica "sp" dla spisu treści SPIS TREŚCI skrót do kotwicy "sp", czyli do spisu treści Odwołania wewnątrz dokumentu

24 Znacznik rozpoczyna listę uporządkowaną Znacznik rozpoczyna element listy Punkt pierwszy. Punkt drugi. Punkt trzeci. Listy uporządkowane

25 Znacznik rozpoczyna listę nieuporządkowaną Znacznik rozpoczyna element listy Dwa pęczki szarańczy. Młode źdźbła trawy. Majonez. Szczypta pieprzu. Lista nieuporządkowana

26 Tabela ta składa się z dwóch kolumn i trzech wierszy. Pierwsza kolumna będzie zawierać nagłówki wierszy, a druga - dane. Bardzo prosta tabela Imię Albert Nazwisko Podpadkiewicz Data urodzenia 03 maja 1952 roku Umieszczanie tabel w dokumentach HTML

27 Zapraszam do tworzenia własnych stron www Opracowała: Elżbieta Piszcz


Pobierz ppt "HTML Język opisu strony www Język HTML (Hypertext Markup Language) należy do grupy języków opisu tekstu, takich jak PostScript, ale pochodzi bezpośrednio."

Podobne prezentacje


Reklamy Google