Wstawianie ilustracji na stronę

 

Poniżej przedstawiony jest kod źródłowy przykładowego dokumentu - należy zwrócić uwagę na sposób umieszczania na stronie WWW ilustracji wklejonej. (tekst wpisany czerwonym kolorem nie jest częścią kodu źródłowego).

<html>
<head>
 

<meta charset="utf-8">  kodowanie tekstu (polskie znaki)
<title>Wstawianie zdjęć na stronę </title> 
</head> 
Tło strony
<body bgcolor="black"> kolor strony jednolity, jeżeli tłem strony ma być fotografia wpisujemy
<body background=nazwa zdjecia.jpg>       zdjęcie musi być w tym samym katalogu co tworzony plik, 
jeżeli nie chcemy pobierać zdjęć na swój komputer, kopiujemy adres zdjęcia w wklejamy po znaczniku img
<body background=http://www.zsp2wadowice.pl/imported/przedmioty/inf/cwiczenia/kl3/html/fotos/0.jpg>
efekt tła 3d , w załącznik wstawiamy bgproperties=fixed
<body background=http://www.zsp2wadowice.pl/imported/przedmioty/inf/cwiczenia/kl3/html/fotos/0.jpg bgproperties=fixed>
 
Wstawienie obrazka

W jaki sposób wstawić obrazek (grafikę, zdjęcie) na stronę WWW?

<img src="Tu podaj względną ścieżkę dostępu do obrazka" alt="Tu podaj tekst alternatywny">
 
Zamiast tekstu: "Tu podaj względną ścieżkę dostępu do obrazka", należy podać miejsce na dysku, gdzie znajduje się nasz obrazek, który chcemy umieścić na stronie. Jeżeli obrazek znajduje się w tym samym katalogu co strona, na której chcemy go wstawić, wystarczy wpisać tutaj samą nazwę pliku obrazka, nie zapominając przy tym o podaniu rozszerzenia (".jpg" lub ".gif").
Natomiast w miejsce "Tu podaj tekst alternatywny" wpisuje się krótką informację, która pojawi się w przypadku, kiedy obrazek nie zostanie wyświetlony (np. jeśli użytkownik wyłączy wyświetlanie grafiki w swojej przeglądarce internetowej).

UWAGA!
Znacznik
<img> nie posiada w jezyku HTML znacznika zamykającego!

ścieżkę dostępu do obrazka

Jeżeli jest w tym samym katalogu co nasza strona wystarczy podać nazwę pliku np.

obrazek.jpg  lub foto1.bmp  ( podajemy nazwę pliku wraz z rozszerzeniem).

Jeżeli plik jest w innym katalogu podajemy całą ścieżkę

katalog/nazwa pliku     np. ../zdjecia/foto1.jpg

Jeżeli chcemy wstawić zdjęcie z Internetu - najeżdżamy kursorem myszki na zdjęcie PPM - wybieramy kopiuj adres zdjęcia

np. http://www.zsp2wadowice.pl/imported/przedmioty/inf/cwiczenia/kl3/html/fotos/49.jpg ( zdjęcie znajduje się na naszej stronie internetowej.


   Rozmiar zdjęcia na stronie 
Dla danego zdjęcia można założyć odpowiedni rozmiar na wyświetlanej stronie przez podanie wysokości i szerokości pola 
 do wyświetlania  ilustracji. szerokość - width podajemy w pikselach wysokość -  height
i tak mając zdjęcie o wymiarach oryginalnych 400x300 pikseli można wyświetlić na stronie podając rozmiar 640x480 pikseli 
/ powiększenie cyfrowe nastąpi minimalne  pogorszenie jakości. 
<img src="gory.jpg"  width="320" height="192" alt="Piękne są krymskie góry">
Wykonanie napisów dynamicznych stylu neon - pod zdjęciem
<marquee bgcolor= yellow behavior=scroll >KRYM 2003</marquee></b> napis przesuwający sie na żółtym tle

<font color="#FF0000"><b><marquee behavior= alternate >KRYM 2003</marquee></b>
napis "odbijający" się

<marquee behavior="slide">KRYM 2003</marquee> typ slajdowy napis obiekt wysunie się od strony lewej do prawej
 
UWAGA!
Bardzo ważne: w nazwach plików lepiej nie używać:
  • wielkich liter
  • znaków, np.: \ / : * ? " < > |
  • spacji (jeśli musisz, w zamian używaj podkreślenia  "_")
  • polskich liter (ą, ć, ę, ł, ń... itd.)