Puste piksele czyli fabryka dziur

Autor: Grzybek

Zdarzyło Wam się na pewno nie jeden raz mieć problem z dopasowaniem właściwej odległości pomiędzy dwoma obiektami na stronie. Na przykład pomiędzy tabelkami lub obiektami w komórkach tabeli.

Pamiętacie bajkę J. Brzechwy „Akademia Pana Kleksa”. Kiedyś Pan Kleks zaprowadził swoich uczniów do fabryki w której produkowano same dziury. Od dziurek w nosie czy serze po dziury w chmurach. Czy dziury mogą się na coś przydać? Otóż tak – w projekcie strony WWW.

Jest na to sposób. Wystarczy wykonać w dowolnym najprostszym edytorze graficznym pusty pikse i zapisać do GIF`a. 1px x 1px, w tabeli kolorów tylko przezroczystość. Taką „dziurę” umieszczamy w kodzie HTML w odpowiednim miejscu np.:

<TABLE WIDTH="100px" CELLSPACING="0" 
CELLPADDING="0" BORDER="0"> 
  <TBODY> 
    <TR><TD class=t1><A HREF="#">Usługi 
internetowe</A></TD></TR> 
    <TR><TD><IMG SRC="pusty_pixel.gif" 
WIDTH="100" HEIGHT="1" BORDER="0" 
ALT=""></TD></TR> 
    <TR><TD class=t1>Reklama internetowa</TD></TR> 
</TBODY></TABLE> 

W parametrach WIDTH i HEIGHT wpisujemy takie wartości aby przeglądarka rozciągnęłą naszą „dziurę” do pożądanych przez nas rozmiarów aby ta spełniła swoje zadanie i w odpowiedni sposób odsunęła od siebie wybrane elementy.

Na koniec dodam że piksele wypełnione dowolnym kolorem (byle z palety webowskiej) rozciągnięte do dowolnych wymiarów mogą zostać użyte jako barwne prostokąty w projekcie. Przy odpowiednim potasowaniu w CSS mogą robić za tło pod inny element lub przy zastosowaniu DHTML przemieszczać się w animacji.

Pozdrawiam,
Grzybek