Umieszczanie tekstu między ilustracjami

Poniżej przedstawiony jest kod źródłowy przykładowego dokumentu - należy zwrócić uwagę na sposób zastosowania odpowiednich wartości atrybutu ALIGN znacznika IMG.

<html>
<head>
<meta http-equiv="Content-Type" content=" text/html; charset=ISO-8859-2">
<title>Gimnazjum nr 3</title>
</head>
<body bgcolor="#ffff00" text="FFFFFF">

Poniższy fragment tekstu przedstawia przykład kodu źródłowego HTML włączającego grafikę do dokumentu w sposób umożliwiający wprowadzanie tekstu między ilustracjami.

<img src="satelita.jpg" align=left>
<img src="satelita.jpg" align=right>

Wartości (left i right) atrybutu ALIGN znacznika IMG umieszczają rysunki wskazane atrybutem SRC odpowiednio po lewej lub po prawej stronie dokumentu. Przestrzeń powstała między rysunkami będzie wypełniona tekstem.
O ile linia nie będzie złamana w specjalny sposób (następny krok), to każdy z rysunków przesuwać będzie tekst aż do jego końca.

<h5><B>Jakiś tekst</B></h5>tekst<br>

<br>I
Nowy Jork, zdjęcie satelitarne. Nowy Jork, jest najgęściej zaludnionym miastem w Stanach Zjednoczonych. U ujścia rzeki Hudson leży most Lower Nowy Jork Bay. Obszar ten jest jednym z większych handlowych ośrodków USA. Na południu usytuowane są Lower Bay i półwysep Sandy Hook. Na wschód od Rockaway Point leży Jamajka Bay. Na północno-wschodniej stronie Jamajki znajduje się John F. Kennedy International Airport. Prostokątny obszar w środkowej części Manhattan Island to Central Park. W północno-zachodniej części tego zdjęcia, znajdują się tereny z licznymi jeziorami. Rzeźba terenu na tym obszarze jest wynikiem działalności erozyjnej i akumulacyjnej lodowca. Czerwone i brązowe zabarwianie to lasy. U ujścia Hudson River - Statua Wolności.
 <img src="satelita.jpg" align=left>
<img src="satelita.jpg" align=right>

Tak jak wyżej

<P>tekst   .<br>
tekst<P><h5><B> Jakiś tam tekst
</B></h5>tekst
.<br>
<P align=right>Pawel


</body>
</html>

 

Tutaj można poćwiczyć

W oknie edytora możesz wprowadzić zmiany w tekście kodu HTML, a po naciśnięciu przycisku "pokaż widok strony" zobaczysz efekt działania edytowanego kodu.