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?

Podobne dokumenty