Wstawianie plików graficznych ( *.jpg, *.jpeg, *.gif, *.bmp, itp.) jest bardzo łatwą czynnością. Wystarczy do kodu HTML naszej strony dodać fragment:

<img src="sciezka_do_pliku_grafiki" width="20" height="30" alt="Napis" border="0" align="left">

Oto opis za co są odpowiedzialne poszczególne fragmenty tego kodu:

src="sciezka_do_pliku_grafiki"

Ten parametr określa nam gdzie znajduje się plik graficzny, który chcemy umieścić na naszej stronie. On musi zostać zdefiniowany, bo inaczej grafika się nie wyświetli. Przykładowy wygląd:

src="www.warezy.net/banner.gif"

width="20"

Dzięki umieszczeniu tego fragmentu, możemy wpłynąć na szerokość obrazka. Możemy go pominąć - jeśli tak zrobimy to obrazek będzie naturalnych rozmiarów. A jeśli nie to ustalamy szerokość w pikselach - podajemy ilość pikseli (na przykładzie wynosi ona 20 pikseli).

height="50"

To samo co parametr width, lecz określa wysokość obrazka (również można pominąć).

alt="Napis"

Kolejny element który nie jest wymagany, lecz może uatrakcyjnić stronę. Jeśli zastosujemy go, to po najechaniu myszką na obrazek, pojawi się napis, o treści taką jaką zdefiniowaliśmy (w moim przykładzie będzie to: Napis).

align="left"

Określa położenie obrazka. Wartości:
left - wyrównuje do lewej;
right - wyrównuje do prawej center - umieszcza obrazek na śridku dostępnej powierzchni
border="0" - określa grubość obramowania obrazka.

Gdy ustalimy 0 to obramowanie nie wyświetli się. Dając wartość różną od 0, można zdefiniować kolor obramowania atrybutem:

bordercolor="#000000"

Zastosowanie tego przykładu spowoduje iż obramowanie będzie miało czarny kolor.

Dodatkowo możemy użyć jeszcze dwóch parametrów, określających odległość obrazka od tekstu:

a) w poziomie:

hspace="0"

b) w pionie:

vspace="0"