Tabele i obrazy
W
HTML`u praktycznym sposobem na rozmieszczanie treści na
stronie były tabele. Język wml również daje nam taką
możliwość. Podobnie jednak jak przy innych elementach, jego
możliwości są skromniejsze od HTML`a, przy tworzeniu tabel
należy też pamiętać o małych rozmiarach wyświetlaczy. Tabela
powinna znajdować się wewnątrz akapitu (otoczona znacznikami
<p> </p>)
<table> </table>Pomiędzy tymi
znacznikami znajduje się nasza tabela, a w znaczniku
otwierającym znajduje się definicja tabeli.
<table> jest używany razem ze znacznikami
<tr> i <td>, które określają
zawartość poszczególnych komórek, którą może być tekst lub
grafika. <table> określa ilość kolumn w
tabeli, lecz nie może (odwrotnie wygląda to w HTML`u) określać
szerokości tabeli. Znacznik ten posiada trzy atrybuty;
- columns="liczba_kolumn" - zaczynam od tego
atrybutu, gdyż jest on obligatoryjny i określa ile kolumn
zawiera tabela
- title="tytul" - tytuł tabeli nie jest
wyświetlany na ekraniku
- align="wyrównanie" - atrybut ten określa
wyrównanie treści wewnątrz komórki tabeli. Jego wartości są
jednak inne niż miało to miejsce w określaniu wyrównania
akapitu. Wyrównanie do lewej określamy "L", do prawej "R", a
do środka "C"
<tr>
</tr>- to nic innego jak określenie wiersza
tabeli. W ramach znaczników tabeli można umieścić wiele
wierszy, które pojawią się na ekraniku
<td>
</td>- ten znacznik określa każdą pojedynczą
komórkę tabeli, której zawartość może być wyrównana
odpowiednim atrybutem znacznika <table>.
Znacznik komórki tabeli musi znajdować się pomiędzy
znacznikami <tr> </tr>, aby
przeglądarka wiedziała w jakim wierszu znajduje się dana
komórka. Przykładowa tabela mogłaby więc wyglądać
następująco;
<table columns="4">
<!--
akurat ta tabela sklada sie z czterech kolumn
kolejne
kolumny oznaczylem kolejnymi liczbami a
kolejne
wiersze literami -->
<tr>
<td>1a
</td>
<td>2a </td>
<td>3a
</td>
<td>4a
</td>
</tr>
<!-- tutaj zaczyna się
drugi wiersz-->
<tr>
<td>1b
</td>
<td>2b </td>
<td>3b
</td>
<td>4b
</td>
</tr>
</table> |
 |
<img/> - to znacznik służący do
wstawiania grafiki do naszej karty [ang. image]. Podstawowa
budowa tego znacznika ma postać <img src="plik
graficzny">, gdzie plik graficzny to oczywiście
nazwa obrazu wraz z rozszerzeniem (.wbmp) jeżeli plik znajduje
się w lokalnym folderze razem z kartą lub lokalizacja- adres
internetowy pliku w sieci. Oprócz src [ang. source], znacznik
<img> posiada także inne atrybuty;
- alt="tekst_alternatywny" - czyli tekst,
który jest wyświetlany, gdy nie można otworzyć obrazka (np.
przeglądarka nie obsługuje grafiki bądź nie można znaleźć
pliku pod wskazaną lokalizacją)
- vspace="dlugosc" - biała przestrzeń
otaczająca obrazek- oddzielająca od innych elementów karty.
Możemy podawać ją w pikselach np. vspace="8" lub procentach;
vspace="25%". Procenty to jednak nie rozmiary obrazka, a
rozmiary wyświetlacza.
- hspace="dlugosc" - to samo tyle że w
poziomie
- height="dlugosc" - rozmiar obrazka w
pionie. Umożliwia skalowanie obrazka do określonej liczby
pikseli (np. height="10") lub do procentowego rozmiaru
wyświetlacza (np. height="30%"). Tego atrybutu należy używać
razem z atrybutem width;
- width="dlugosc" - jak wyżej, tyle że w
poziomie
- align="wyrownanie" - określa wyrównanie
obrazka względem otaczającego tekstu (top/middle/bottom)
Jak już napisałem w
poprzednim artykule, dokumenty wml mogą zawierać jedynie
grafikę w formacie wbmp, które niestety nie są zbyt okazałe.
Aby poćwiczyć rysowanie w nowym formacie kliknij w Nokia WAP
Toolkit; File-New-WBMP Image... i po ustaleniu rozmiaru
obrazka możesz tworzyć swoje wapowe dzieła sztuki.
Więcej o
narzędziach do wbmp w narzędziach
Tabele i obrazy urozmaicają
naszą wapową witrynę, choć nie napisałem jeszcze przecież jak
można łączyć między sobą karty aby móc przechodzić z jednej do
drugiej, ale o tym już w następnym odcinku...
|
KURSY
