Komendy języka HTML. Część III
Transkrypt
Komendy języka HTML. Część III
Komendy języka HTML. Część III Co na dziś? • Obrazek • Tabela Powtórzenie • w jaki sposób dokonać animacji obiektu? Wymień rodzaje animacji? • W jaki sposób wstawić i formatować linie? • W jaki sposób zrobić numerowanie i wypunktowanie na stornie internetowej? Wstawianie obrazka <img src="Tu podaj nazwę obrazka" alt="Tu podaj tekst alternatywny" /> Przykład: <img src=„owoc.jpg" alt=„Owoc" /> Obrazek powinien być umieszczony w tym samym folderze co plik html !!! Ustawienie obrazka na stronie (left, right) <img src="Tu podaj nazwę obrazka" alt="Tu podaj tekst alternatywny" align="ustawienie" /> Przykład: <img src=„roza.gif" alt="Tu jest roza” align=„left" /> Wyśrodkowanie obrazka <center><img src="Tu podaj nazwe obrazka" alt="Tu podaj tekst alternatywny" /></center> Przykład: <center><img src=„on.jpg” alt=„osoba" /></center> Ustawienie tła za pomocą obrazka <body background= Tu podaj względną ścieżkę dostępu do obrazka> Przykład: <body background= pistolet.bmp> Obrazek o określonych wymiarach <img src=„nazwa obrazka" alt="Tekst alternatywny" width="x" height="y" /> Przykład: <img src=„orzeł.gif" alt=„Orzeł” width=„30" height=„20" /> Obrazek z obramowaniem <img src=„nazwa obrazka" alt="Tekst alternatywny" border="n" /> Przykład: <img src=„mis.gif" alt=„mis" border=„8" /> Struktura tabeli <table> <tr> <td>...</td> </tr> <tr> <td>...</td> </tr> </table> <td>...</td> <td>...</td> Przykład tabeli <table> <tr> <td>1</td> </tr> <tr> <td>3</td> </tr> </table> <td>2</td> <td>4</td> Obramowanie tabeli <table border="x"> <tr> <td>1</td> </tr> <tr> <td>3</td> </tr> </table> <td>2</td> <td>4</td> Kolor w jednym wierszu <table> <tr bgcolor="kolor">...</tr> </tabele> Przykład <table> <tr bgcolor="orange"> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> Kolor całej tabeli <table bgcolor="kolor">...</table> Przykład: <table bgcolor=" aqua "> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> Kolor w pojedynczej komórce <table> <tr> <td bgcolor="kolor">...</td> </tr> </table> Kolor w pojedynczej komórce przykład <table> <tr> <td bgcolor=„lime">1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> Tło obrazkowe w całej tabeli <table background=„nazwa obrazka">...</table> Przykład: <table background=„pies.jpg"> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> Kolor obramowanie całej tabeli <table bordercolor="kolor">...</table> <table bordercolorlight="kolor1">...</table> <table bordercolordark="kolor2">...</table> lewa oraz górna krawędź obramowania bordercolorlight, bordercolor - całeobramowanie, prawa oraz dolna krawędź obramowania bordercolordark Przykład 1 <table bordercolor=„blue"> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> Przykład 3 <table border="5" bordercolordark="navy" bordercolorlight="aqua"> <tr> <td>komórka1</td><td>komórka2</td> </tr> <tr> <td>komórka3</td><td>komórka4</td> </tr> </table> Kolor obramowanie w pojedynczej komórce <table> <tr> <td bordercolor="kolor">...</td> </tr> </table> Przykład <table border="5" bordercolordark="navy" bordercolorlight="aqua"> <tr bordercolordark="maroon" bordercolorlight="red"> <td>1</td> <td>2</td> </tr> <tr> <td bordercolor="lime">3</td> <td>4</td> </tr> </table> Ćwiczenie Podsumowanie • • • • • • Jak wstawić obrazek? jak zmienić rozmiar obrazka? Jak wstawić tabelę? Jak zmienić kolor obramowania tabeli? Jak wypełnić komórkę kolorem? Jak wypełnić komórkę konkretnym obrazkiem?