Всем понятно что сайт без картинок будет выглядеть как то не очень А посему нужно на сайт картинки вставить. Возьмём для примера вот такую картинку:
Хотя по барабану какую картинку вы будете вставлять, хоть своё фото.
Сначала вам нужно сохранить эту картинку у себя на компьютере. Как это сделать я думаю лбъяснять излишне. (Как я рекомендовал ранее - сделайте отдельную папку site на диске D например и туда сохраняйте все файлы уроков.) Сохраните картинку там-же, где находится страничка, которую мы делаем - page.html Имя файла картинки оставьте тоже самое wezor.jpg Опять же будьте внимательны к расширению картинки! Имя файла не wezor.ipg, не wezor.jpq, а wezor.jpg
Для вставки на страницу картинки - используется тег img. это он аглийского слова image...изображение, картинка.В качестве параметра для этого тега, используется название картинки.Должен же компьютер знать какую картинку мы хотим вставить.
В нашем случае для вставки картинки wez.jpg вставляем в код страницы, в то место куда мы хотим вставить картинку, следующий код :
<img src=wovanich.jpg>
или более грамотно писать вот так
<img src="wovanich.jpg">
хотя код выше тоже будет работать.
через параметр src указывается имя файла-картинки. src от английскогого слова source - ресурс, источник
img src= можно расшировать как изображение источник/название файла
Таким образом код нашей страницы теберь будет выглядеть вот так:
<html> <head> <title>Моя первая интернет страница всего лишь за 5 минут</title> </head>
<body bgcolor="#00CCFF" text="#FFFF00">
<center>
Сегодня замечательный день. <br>Я сделал свою первую интернет страничку.
<br><font color="#0000FF">я буду богатым и свободным человеком !</font>
<br><br>
<img src="wovanich.jpg">
</center>
</body>
</html>
теги br вставлены чтобы расположить картинку на несколько строк ниже текста.
Желательно в параметрах картинки указать ее размеры. Для этого используется параметр width (ширина картинки) и height (высота картинки).
(также будьте внимательны в написании. Не with, не witdh, не heihgt)
Т.е. например вот так :
<img src="wovanich.jpg" width="299" height="54" >
размеры картинки указываются в пикселях.
Если вы хотите, чтобы при наведении мышки на картинку отображался какой-то текст, то это делается с помощью параметра alt например вот так :
<img src="wovanich.jpg" width="299" height="54" alt="Сайт о заработке в интернете" >
Этот текст также будет виден, если у вас выключено отображение графики в браузере (для экономии трафика например). Но этот параметр работает не во всех браузерах. В Internet Explorer работает.
аналог этой команды - параметр title=
внесите изменения в код и посмотрите что получится.
Таким образом код нашей страницы будет такой :
<html> <head> <title>Моя первая интернет страница всего лишь за 5 минут</title> </head>
<body bgcolor="#00CCFF" text="#FFFF00">
<center>
Сегодня замечательный день. <br>Я сделал свою первую интернет страничку.
<br><font color="#0000FF">я буду богатым и свободным человеком !</font>
<br><br>
<img src="wovanich.jpg" width="299" height="54" alt="Сайт о заработке в интернете">
</center>
</body>
</html>
Если у вас вместо картинки показывается "крестик",то значит вы допустили одну из распространенных ошибок:
- сохранили файл не в той же папке, где находится html-файл. - сохранили файл под другим именем, например не верно указали расширение файла. Должно быть jpg - допустили ошибку в параметре, написав например scr= вместо src= - не верно указали имя файла или расширение после src=
