html (164 788 bajtów)
Transkrypt
html (164 788 bajtów)
Odsyłacze <A HREF=URL> ... </A> — polecenie odsyłcza do dokumentu wskazywanego przez url. Dodatkowym parametrem jest opcja TARGET="...", która wskazuje na miejsce otwarcia wskazywanego dokumentu, a jej parametrami mogą być: self — otwarcie w tym samym oknie (wartość domyślna), top — otwarcie w tym samym oknie z pominięciem struktury ramek, blank — otwarcie w nowym oknie przeglądarki, parent — otwarcie w ramce nadrzędnej. <A HREF=URL#etykieta> ... </A> — polecenie odsyłacza do dokumentu wskazywanego przez url, które zawiera lokalne odsyłacze w dokumencie. <A NAME=etykieta></A> — definiowanie etykiet odsyłaczy lokalnych. <A HREF="mailto:[email protected]"> ... </A> — definiowanie odsyłacza do poczty elektronicznej. Style nagłówkowe <H1>tekst <H2>tekst <H3>tekst <H4>tekst <H5>tekst <H6>tekst H1</H1> H2</H2> H3</H3> H4</H4> H5</H5> H6</H6> Modyfikacja kroju pisma Listy — Numerowana: <OL> <LI> pierwszy element listy </LI> <LI> drugi element listy </LI> <LI> trzeci element listy </LI> </OL> — Nienumerowana: <UL> <LI> pierwszy element listy </LI> <LI> drugi element listy </LI> <LI> trzeci element listy </LI> </UL> — Opisowa: <DL> <DT>Temat <DD> opis <DT>Temat <DD> opis <DT>Temat <DD> opis </DL> pierwszy</DT> pierwszego elementu listy</DD> drugi</DT> drugiego elementu listy</DD> trzeci</DT> trzeciego elementu listy</DD> UWAGA∗ listy można zagnieżdżać Umieszczanie grafiki W dokumentach HTML można umieszczać grafikę w formacie *.GIF oraz *.JPG. <IMG SRC="obraz.jpg"> — polecenie umieszczenia grafiki rastrowej w dokumencie HTML. Dodatkowe parametry to: ALT="nazwa alternatywna" — umieszczenie nazwy obrazu. Nazwa ta pokazuje się w przeglądarce do momentu załadowania obrazu, oraz po załadowaniu obrazu, w postaci dymka. Parametr ważny z punktu widzenia przeglądarek tekstowych. width="10" — ustalenie szerokości obrazu, height="10" — ustalenie wysokości obrazu, border="1" — określenie szerokości ramki okalającej obraz. Tabele w HTML <TABLE>... </TABLE> — początek i koniec tabeli <TR>... </TR> — początek i koniec wiersza tabeli <TD>... </TD> — początek i koniec komórki tabeli border="1" — parametr ustalający grubość ramek tabeli width="100" — parametr ustalający szerokość komórki lub tabeli height="100" — parametr ustalający wysokość komórki lub tabeli. align="wyrównanie" — parametr ustalający wyrównanie poziome tabeli bądź komórki. Parametr wyrównanie może przyjmować wartości: left — wyrównanie do lewej, right — wyrównanie do prawej, center — wyrównanie do środka. valign="wyrównanie" — parametr ustalający wyrównanie pionowe tabeli bądź komórki. Parametr wyrównanie może przyjmować wartości: top — wyrównanie do góry, middle — wyrównanie do środka, bottom — wyrównanie do dołu. cellspacing="0" — odległość między komórkami (w pikselach) cellpadding="0" — odległość pomiędzy ramką i zawartością komórki (w pikselach) bgcolor=kolor — ustalenie koloru tła tabeli <CAPTION>... </CAPTION> — tytuł tabeli. Umieszczany zaraz za znacznikiem <TABLE> lub bezpośrednio przed </TABLE>. <TABLE> <TR><TD>1</TD><TD>2</TD></TR> <TR><TD>3</TD><TD>4</TD></TR> </TABLE> <TABLE border="1"> <TR><TD>1</TD><TD>2</TD></TR> <TR><TD>3</TD><TD>4</TD></TR> </TABLE> <TABLE border="1"> <TR><TD width="100">1</TD><TD>2</TD></TR> <TR><TD>3</TD><TD height="50">4</TD></TR> </TABLE> Wyrównywanie tekstu w komórkach align="wyrównanie" — parametr ustalający wyrównanie poziome. Parametr wyrównanie może przyjmować wartości: left — wyrównanie do lewej, right — wyrównanie do prawej, center — wyrównanie do środka. valign="wyrównanie" — parametr ustalający wyrównanie pionowe. Parametr wyrównanie może przyjmować wartości: top — wyrównanie do góry, middle — wyrównanie do środka, bottom — wyrównanie do dołu. <TABLE border="1"> <CAPTION>Tytuł tabeli</CAPTION> <TR><TD align="left" width="100" height="50">left</TD> <TD align="right" width="100" height="50">right</TD> <TD align="right" width="100" height="50">center</TD></TR> <TR><TD valign="top" height="50">top</TD> <TD valign="middle" height="50">middle</TD> <TD valign="bottom" height="50">bottom</TD></TR> </TABLE> Scalanie komórek colspan="n" — parametr ustalający szerokość komórki. Parametr n oznacza liczbę kolumn. rowspan="n" — parametr ustalający wysokość komórki. Parametr n oznacza liczbę wierszy. <TABLE border="1"> <TR><TD width="20" height="20"> </TD> <TD align="center" colspan=3 height="20">A</TD></TR> <TR><TD valign="middle" width="10" rowspan=3>B</TD> <TD height="10" width="10"> </TD> <TD height="10" width="10"> </TD> <TD height="10" width="10"> </TD></TR> <TR><TD height="10" width="10"> </TD> <TD height="10" width="10"> </TD> <TD height="10" width="10"> </TD></TR> <TR><TD height="10" width="10"> </TD> <TD height="10" width="10"> </TD> <TD height="10" width="10"> </TD></TR> </TABLE> Zadanie Napisać dokument HTML, który będzie przedstawiał następującą tabelę: Przykładowe rozwiązanie <html> <head> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-2"> <title>Tabela</title> </head> <body bgcolor="#FFFF00"> <table cellpadding="0" cellspacing="0" border="1" width="400" align="Center" bgcolor="#FF0000"> <caption><STRONG>To jest tytuł tabeli</STRONG><BR> </caption> <tr valign="Top"> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> </tr> <tr valign="Top"> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> </tr> <tr valign="Top"> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> </tr> <tr valign="Top"> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> </tr> <tr valign="Top"> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> <td valign="Top"><br></td> </tr> </table> </body> </html>