HTML cd. Ramki, tabelki

Podobne dokumenty
Języki programowania wysokiego poziomu. HTML cz.2.

Atrybuty znaczników HTML

Tabela z komórkami nagłówkowymi (wyróżnionymi)

Tworzenie stron internetowych w kodzie HTML Cz 5

HTML (HyperText Markup Language) hipertekstowy język znaczników

HTML ciąg dalszy. Listy, formularze

Za pomocą atrybutu ROWS moŝemy dokonać podziału ekranu w poziomie. Odpowiedni kod powinien wyglądać następująco:

Tabele. Przykład 15a.htm. <HTML><HEAD><TITLE> Cennik</TITLE></HEAD><BODY><H3>Cennik</H3> <TABLE BORDER="1"> <TR>

Kurs HTML 4.01 TI 312[01]

Odsyłacze. Style nagłówkowe

9. TABELE KURS HTML.

Programowanie WEB PODSTAWY HTML

Deklarowanie tytułu związanej z tabelą

HTML (HyperText Markup Language)

Wykład 2 TINT. XHTML tabele i ramki. Zofia Kruczkiewicz

Wykład 2 Tabele i ramki 1. Tabele 1.1. Podstawy budowy tabel na stronach WWW

Tworzenie stron internetowych RAMKI

Najprostszy dokument HTML. <html> <body> Dowolny tekst. </body> </html>

Język HTML i podstawy CSS

LABORATORIUM 2 WSTĘP DO SIECI TELEINFORMATYCZNYCH TABELE I FORMULARZE

Wprowadzenie do języka HTML

[ HTML ] Tabele. 1. Tabela, wiersze i kolumny

Często używanym elementem języka HTML są tabele, które wykorzystuje się do wygodnego rozmieszczania informacji i obrazów.

Kurs HTML. Wykład 4. Tworzenie tabel na stronie WWW. Umieszczanie grafiki w komórkach tabel.

Tutorial. HTML Rozdział: Ramki

zmiana koloru tła <body bgcolor = kolor > tło obrazkowe <body background= ścieżka dostępu do obrazka >

Wprowadzenie do HTML

Wybrane znaczniki HTML

Tworzenie stron internetowych w oparciu o język HTML

IOF INTERNET OFFER FORMAT

Widżety KIWIPortal. tworzenie umieszczanie na stronach internetowych opcje zaawansowane. Autor: Damian Rebuś Data: Wersja: 1.

obecnie tabeli nie stosuje się do budowy struktury witryny (stosuje się za to pozycjonowanie elementów i warstwy) faktycznie wymagają

HTML umożliwia zapis treści dokumentu i równocześnie opis jego układu graficznego.

Hyper Text Markup Language

Jacek Wiślicki Systemy Multimedialne, wykład 0

wczesnych etapów rozwoju HTML. W związku z tym wyróżnia si ę dwa modele tabel - starszy prosty i nowszy złożony: Elementy modelu

Serwisy Internetowe Klient Plan wykładu

HTML 1. Gimnazjum nr 1 w Barcinie gimbarcin.pl

TWORZENIE STRON WWW. Zasady opisu stron w języku HTML:

Podstawy HTML i CSS. Wydział Matematyki, Informatyki i Ekonometrii Uniwersytet Zielonogórski

Cel ogólny lekcji: Wprowadzenie dodatkowych znaczników. Wprowadzenie odsyłacza, tabeli, listy numerowanej i wypunktowanej.

Dydaktyka Informatyki-internet i podstawy języka HTML

HTML podstawowe polecenia

Podstawowe znaczniki języka HTML.

Young Programmer: HTML+PHP. Dr inż. Małgorzata Janik, Zajęcia #2

TECHNOLOGIE SIECI WEB

Wykład 3 - część I. I. TABELE. dr Artur Bartoszewski - Nowoczesne technologie informatyczne - WYKŁAD

Wstęp 5 Rozdział 1. Informacje podstawowe 9

Ćwiczenie 6 Ramki. Spakowane pliki do zadań do pobrania ze strony w pliku pliki_cw6.zip

JAVASCRIPT (cz. IV) ĆWICZENIA DO SAMODZIELNEGO WYKONANIA materiały dydaktyczne dla słuchaczy opracowanie: by Arkadiusz Gawełek, Łódź

Studia Podyplomowe dla nauczycieli w zakresie ICT, języka obcego i informatyki. (finansowane przez EFS oraz MEiN) JĘZYK HTML

HTML/XHTML. dr Beata Kuźmińska-Sołśnia

Przy wstawianiu znacznika zamykającego nie przepisujemy już atrybutów.

Podstawy HTML. Tworzenie stron internetowych. Tomasz Piłka. Ucz się, jak gdybyś miał żyć wiecznie, żyj jak gdybyś miał umrzeć jutro

przygotował: mgr Szymon Szewczyk PODSTAWY

Język HTML. Zasady nazywania i zapisywania plików: Struktura dokumentu: HyperText Markup Language, czyli język hipertekstowy.

..:: Kurs języka XHTML ::..

Format HTML. Wybrane działy Informatyki Stosowanej. Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty

I. Wstawianie rysunków

Technologie Internetowe

e r T i H M r e n L T n

Laboratorium 1: Szablon strony w HTML5

używane skróty: HTTP - protokół do transferu tekstu, hipertekstu, zbiorów binarnych URL - jednolity lokalizator zasobów

Oczywiście występują także znaczniki, bez ich odpowiednika kończącego, np. <BR>

Temat 2: Tabela jako szablon strony

Technologie internetowe

Specyfikacja techniczna dot. mailingów HTML

Witryna internetowa. Należy unikać w nazwach plików używania polskich znaków.

Nazwa implementacji: CSS i box model. Autor: Opis implementacji: Poznajemy podstawy CSS oraz dowiadujemy się o rozmieszczaniu elementów na stronie.

Specyfikacja mailingu GG Network

Tworzenie stron internetowych w kodzie HTML Cz 7

HTML część 4. Obrazki, tła i kolory

Przetwarzanie dokumentów XML i zaawansowane techniki WWW Zdarzenia w JavaScript (Zajęcia r.)

Strony WWW - podstawy języka HTML

Wybrane zagadnienia programowania dla World Wide Web

Tworzenie Stron Internetowych. odcinek 4

Kurs WWW wykład 6. Paweł Rajba

Blok dokumentu. <div> </div>

Środki dydaktyczne: tablica, komputer (z Notatnikiem i przeglądarką www) pliki ramkapion.zip, ramkapoziom.zip, zagniezdzenieramek.zip.

ABC języka HTML i XHTML / Maria Sokół. wyd. 2. Gliwice, cop Spis treści

Elementarz HTML i CSS

Formularze Pobierają dane od użytkownika strony i wysyłają je do przetworzenia na serwerze (gdzie potrzebne są skrypty,któredaneprzetworzą najczęściej

Spis treści. Konwencje zastosowane w książce...5. Dodawanie stylów do dokumentów HTML oraz XHTML...6. Struktura reguł...9. Pierwszeństwo stylów...

Edukacja na odległość

Konspekt do lekcji elementy informatyki dla klasy 4e Liceum Ogólnokształccego

XHTML Budowa strony WWW

Podstawowe polecenia serwisu FTP. Usługi sieciowe Tworzenie stron WWW: Podstawowe polecenia serwisu FTP. Usługi sieciowe

I. Dlaczego standardy kodowania mailingów są istotne?

HTML. HTML(ang. HyperTextMarkupLanguage, pol. hipertekstowy język znaczników) język wykorzystywany do tworzenia stron internetowych

Informatyka i Ekonometria Informatyka ekonomiczna Ćwiczenia Usługi sieciowe. Tworzenie serwisów internetowych.

DOM (Document Object Model)

Podstawy tworzenia stron internetowych

Justyna Klimczyk Nauczyciel informatyki Gimnazjum im. Władysława Stanisława Reymonta w Kleszczowie

Architektura WWW. HTML Część I - Podstawy. HTML język tworzenia stron WWW. Znaczniki HTML. Struktura dokumentu HTML. Kodowanie polskich liter

Języki programowania wysokiego poziomu. HTML cz.1.

PROGRAMOWANIE. WNPiD UAM, Programowanie, inż. Piotr Jabłoński

Technologie Informacyjne

Dokument hipertekstowy

HTML i XHTML. Leksykon kieszonkowy

Transkrypt:

HTML cd. Ramki, tabelki

Ramki Umożliwiają wyświetlanie kilku niezależnych dokumentów w tym samym oknie w układzie pionowym, poziomym lub mieszanym. Wady: kłopotliwe drukowanie, konieczność zapanowania nad wieloma dokumentami, w źle opracowanych stronach nowa strona otwiera się w ramce, z której została wywołana, błędne zapisywanie bookmark-ów

<frameset>... </frameset> Określa układ i zawartość zbioru ramek Atrybuty: cols lub rows Wartości: liczba pikseli % szerokości wysokości strony * oznacza dopełnienie do 100% Atrybuty standardowe: id, class, title, style Układ pionowy i poziomy należy określić w osobnym <frameset> Uwaga!!!: Nie może występować równocześnie z <body>... </body> (wyjątek użycie znacznika <noframes>)

<frame /> Definiują pojedynczą ramkę Atrybuty: frameborder = 0 1 longdesc = URL marginheight = pixele marginwidth = pixele name = nazwa_ramki noresize = noresize scrolling = yes no auto src = URL Atrybuty standardowe: id, class, title, style

<noframes>... </noframes> Służy do opracowania zawartości dokumentu dla przeglądarek nie obsługujących ramek Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Uwaga!!!: Tekst między znacznikami <noframes>... </noframes> powinien być ujęty w znaczniki <body>... </body>

<iframe>... </iframe> Definiują wewnętrzną ramkę w dokumencie html Atrybuty: align = left right top middle bottom frameborder = 1 0 height = piksele % width = piksele % marginheight = piksele marginwidth = piksele longdesc = URL name = nazwa_ramki scrolling = yes no auto src = URL Atrybuty standardowe: id, class, title, style

Przykład <html> <frameset rows= 50,* > <frame src= naglowek.html > <frameset cols= 150,70%,* > <frame src= lewe_menu.html > <frame src= dokument.html > <frame src= prawe_menu.html > </frameset> </frameset> </html>

Tabele Definiowanie tabel o zadanym przez użytkownika wyglądzie Komórki tabeli mogą być łączone wierszami i/lub kolumnami Granice komórek mogą być wyłącznie pionowe i poziome Tabele można zagnieżdżać Znaczniki: <table>, <th>, <tr>, <td>, <caption>, <colgroup>, <col>, <thead>, <tbody>, <tfoot>

<table>... </table> Definiują tabelę Wewnątrz tabeli można umieścić wiersze, kolumny, wiersz nagłówkowy i inne tabele Atrybuty: align, bgcolor, border, cellpadding, cellspacing, frame, rules, summary, width Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<table> - atrybuty align = left center right nie zalecane zalecane style bgcolor = rgb(n,n,n) #xxxxxx nazwa_koloru nie zalecane zalecane style border = piksele wartość 0 oznacza brak ramki cellpadding = piksele n% cellspacing = piksele n% frame = void above below hsides lhs rhs vsides box border tylko w połączeniu z atrybutem border rules = none groups rows cols all tylko w połączeniu z atrybutem border summary = text width = piksele n%

Definiują wiersz tabeli <tr>... </tr> Muszą być użyte wewnątrz <table>... </table> Atrybuty: align, bgcolor, char, charoff, valign Atrybuty nie zalecane: bgcolor Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<tr> - atrybuty align = left right center justify char valign = top middle bottom baseline char = znak_do_którego_wyrównany_tekst tylko dla align= char charoff = piksele n% tylko dla align = char bgcolor = rgb(n,n,n) #xxxxxx nazwa_koloru

<th>... </th> Definiuje komórki wiersza nagłówkowego tabeli wyróżnione pogrubioną czcionką Musi być użyty wewnątrz <tr>... </tr> Atrybuty: abbr, align, axis, bgcolor, char, charoff, colspan, headers, height, nowrap, rowspan, scope, valign, width Atrybuty nie zalecane: bgcolor, height, width, nowrap Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<th> - atrybuty abbr = tekst_skrócony align = left right center justify char valign = top middle bottom baseline char = znak_do_którego_wyrównany_tekst tylko dla align= char charoff = piksele n% tylko dla align = char colspan = n rowspan = n height = piksele n% width = piksele n% nowrap = nowrap axis = nazwa_komórki bgcolor = rgb(n,n,n) #xxxxxx nazwa_koloru headers = lista_id_komórek_oddzielanych_spacjami scope = col colgroup row rowgroup

<td>... </td> Definiują zawartość komórki tabeli Muszą być użyte wewnątrz <tr>... </tr> Atrybuty: abbr_text, align, axis, bgcolor, char, charoff, colspan, headers, height, nowrap, rowspan, scope, valign, width Atrybuty nie zalecane: bgcolor, height, width, nowrap Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<caption>... </caption> Definiują tytuł tabeli Muszą być umieszczone bezpośrednio po znaczniku <table> Nie może być więcej niż jeden tytuł Domyślne położenie: nad tabelą, wyśrodkowane Atrybuty (atrybuty nie zalecane): align = left right top bottom Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<colgroup>... </colgroup> Definiują grupę kolumn tabeli np. na potrzeby identycznego formatowania Element pusty składa się tylko ze znaczników Atrybuty: align, char, charoff, span, valign, width Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<colgroup> - atrybuty align = right left center justify char valign = top middle bottom baseline char = znak_do_którego_wyrównany_tekst tylko dla align= char charoff = piksele n% tylko dla align = char span = liczba_kolumn width = n% piksele szerokość_względna może być przesłonięte przez ustawienia atrybutów znacznika <col>

<col /> Definiuje atrybuty jednej lub więcej kolumn Tylko wewnątrz <table>... </table> lub <colgroup>... </colgroup> Element pusty tylko znaczniki Używany by zmienić ustawienia dla kolumny w grupie kolumn Atrybuty: align, char, charoff, span, valign, width Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<col> - atrybuty align = right left center justify char valign = top middle bottom baseline char = znak_do_którego_wyrównany_tekst tylko dla align= char charoff = piksele n% tylko dla align = char span = liczba_kolumn width = n% piksele szerokość_względna przesłania atrybut znacznika <colgroup>

<thead>,<tbody>,<tfoot> Umożliwiają grupowanie wierszy tabeli Umożliwiają skrolowanie wnętrza tabeli niezależnie od wierszy nagłówka i podsumowania Wiersz nagłówka i podsumowania pojawią się na każdej stronie wielostronicowego wydruku Muszą zawierać <tr>... </tr> Ważna kolejność <thead> <tbody> <tfoot> Problemy z przeglądarkami Atrybuty: align, char, charoff, valign Atrybuty standardowe: id, class, title, style, dir, lang, xml:lang Atrybuty zdarzeń: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

<theader>, <tbody>, <tfoot> - atrybuty align = right left center justify char valign = top middle bottom baseline char = znak_do_którego_wyrównany_tekst tylko dla align= char charoff = piksele n% tylko dla align = char