Pobieranie prezentacji. Proszę czekać

Pobieranie prezentacji. Proszę czekać

Tworzenie stron internetowych www World Wide Web Język HTML czyli Hyper Text Markup Language.

Podobne prezentacje


Prezentacja na temat: "Tworzenie stron internetowych www World Wide Web Język HTML czyli Hyper Text Markup Language."— Zapis prezentacji:

1 Tworzenie stron internetowych www World Wide Web Język HTML czyli Hyper Text Markup Language

2 Język HTML HTML, czyli HyperText Markup Language, to język służący do tworzenia dokumentów hipertekstowych, czyli zawierających (oprócz tekstu) grafikę, animacje czy dźwięki, ale przede wszystkim powiązany ze sobą systemem odnośników (linków) umożliwiając aktywną współpracę z odbiorcą. Mimo to sam dokument HTML jest zwykłym plikiem tekstowym.

3 Tagi HTML Dokument HTML to plik tekstowy zawierający komendy (tagi) sterujące wyświetlaniem zawartości. Tagi umieszcza się w nawiasach trójkątnych; zwykle należy pamiętać o zamknięciu obszaru działania danego taga!... i zawiera: 1) głowę dokumentu między tagami.. 2) ciało dokumentu między tagami..

4 Struktura dokumentu HTML - otwarcie … - tytuł, standard kodowania liter… … - właściwa treść dokumentu - zamknięcie

5 Bardzo ważnym elementem strony WWW jest informacja o stronie kodowej dokumentu. Zalecana strona kodowa to ISO Informacja umieszczona jest w ramach znaczników i wygląda następująco: Kodowanie strony

6 Nagłówek Nagłówek Moja własna strona

7 W nagłówku dokumentu umieszcza się zwykle informacje ważne dla przeglądarek i wyszukiwarek – są to tzw. znaczniki META. Znaczniki META

8 Treść dokumentu - Treść dokumentu - Tu mogę wpisywać tekst, który po prostu ukaże się na mojej stronie.

9 To jest moja pierwsza strona WWW. A teraz przepisując poniższy kod źródłowy utworzymy pierwszą stronę

10 Kolor tła dokumentu "kolor" może być podany imiennie (np. red, green, black, white) lub za pomocą wartości szesnastkowych - #FF0000, #008000, #000000, #FFFFFF

11 Kolor tła określamy za pomocą atrybutu bgcolor znacznika : rgb(255, 255, 0) Tłem strony może być też tapeta zapisana w pliku graficznym, którego nazwę podaje się jako wartość atrybutu background: Kolor tła

12 To jest moja pierwsza strona WWW.

13 Akapit tekstu : tekst Zmiana linii wewnątrz akapitu: tekst nowa linia tekstu Wycentrowanie tekstu: tekst Formatowanie cech czcionki tekstu ten tekst będzie wytłuszczony ten tekst będzie pochylony ten tekst będzie podkreślony

14 Wyrównywanie tekstu Tekst wyrównany do lewej. Wyrównanie do prawej. Centrowanie. Justowanie.

15 Formatowanie tytułów Tytuł główny (największy) Tytuł drugiego poziomu Tytuł trzeciego poziomu Tytuł czwartego poziomu

16 Pozioma linia Opcje dodatkowe: size – rozmiar w pikselach, color – kolor linii, width – długość w pikselach lub procentach strony. strony. align – typ wyrównania (do lewej, środka, prawej)

17 size - rozmiar czcionki (od 1 do 7, wartością domyślną jest 3) color - kolor face - krój Rozmiar, kolor i krój czcionki można określić za pomocą znacznika... i jego atrybutów: Można też używać bardziej uniwersalnych znaczników, takich jak:... - powiększenie czcionki o 1 punkt,... - zmniejszenie czcionki o 1 punkt. Definiowanie czcionek

18 Wielkość czcionki Wielkość bezwzględna Tekst objęty definicją x = Wielkość względna Tekst objęty definicją x = 1...6

19 Kolor czcionki Tekst objęty poleceniem Szesnaście podstawowych barw: black silver gray white maroon red purple fuchsia green lime olive yellow navy blue teal aqua Kolor może być podany kodem hexadecymalnym w postaci: #CCF78A

20 Lista wypunktowana: temat 1 temat Lista numerowana: punkt 1 punkt 2....

21 Do tworzenia odnośników służy znacznik (anchor – kotwica), którego podstawowym atrybutem jest href (Hypertext REFerence), określający adres odnośnika: Wstawianie odnośników Jeśli chcemy, aby elementem interaktywnym był obrazek, po prostu wstawiamy w odpowiednim miejscu znacznik tekst aktywny Odsyłacz do dokumentu istniejącego w tym samym folderze: Zadania z fizyki

22 Wstawianie obrazków: IMG jest skrótem od Image (obraz), SRC jest skrótem od Source (żródło). Aby wstawić w tekst obrazek posługujemy się komendą: Obrazek wyśrodkowany w wierszu: Sterujemy wielkością obrazka: Jeśli nie chcemy otaczać obrazka tekstem, wstawiamy go w wydzielony akapit:

23 Sposób rozmieszczenia tekstu wokół obrazka określany jest za pomocą atrybutu ALIGN znacznika. ALIGN = top Wyrównanie grafiki Do pionowego zorientowania rysunku względem wiersza używane są następujące wartości: Do oblewania grafiki tekstem używane są wartości left, right: ALIGN = left - dosunięcie obrazka do lewej i otoczenie go tekstem z prawej strony, ALIGN = right - odwrotnie ALIGN = middle ALIGN = bottom Ania na spacerze Przykład:


Pobierz ppt "Tworzenie stron internetowych www World Wide Web Język HTML czyli Hyper Text Markup Language."

Podobne prezentacje


Reklamy Google