| >>> Зарабатывайте до 30% в месяц Подробнее... |
Вставляем на сайт картинку
Допустим вы решили вставить на сайт вот такую картинку :
Сначала вам нужно сохранить эту картинку у себя на компьютере. Для этого наведите
курсор мышки на картинку и нажмите правую кнопку мышки. Выберите "Сохранить
рисунок как..." Укажите место для сохранения картинки (Как я рекомендовал
ранее - сделайте отдельную папку site на диске С например и туда сохраняйте
все файлы уроков.)
Сохраните картинку там-же, где находится страничка, которую мы делаем - page.html
Имя файла картинки оставьте тоже самое money-master.jpg
Опять же будеть внимательны! Имя файла не money-master.ipg, не money-master.jpq,
а money-master.jpg
Для вставки на страницу картинки - используется тег <img>. img это он
аглийского слова image...изображение, картинка.В качестве параметра
для этого тега, используется название картинки.Должен же компьютер знать какую
картинку мы хотим вставить 
В нашем случае для вставки картинки money-master.jpg вставляем в код страницы, в то место куда мы хотим вставить картинку, следующий код :
<img src=money-master.jpg>
или более грамотно писать вот так <img src="money-master.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="money-master.jpg">
</center>
</body>
</html>
теги <br> вставлены чтобы расположить картинку на несколько строк ниже текста.
Теперь наша страница будет выглядеть вот ТАК.
Желательно в параметрах картинки указать ее размеры. Для этого используется параметр width (ширина картинки) и height (высота картинки).
(также будьте внимательны в написании. Не with, не witdh, не heihgt)
Т.е. например вот так :
<img src="money-master.jpg" width="258" height="146" >
размеры картинки указываются в пикселях.
Если вы хотите, чтобы при наведении мышки на картинку отображался какой-то текст, то это делается с помощью параметра alt
например вот так :
<img src="money-master.jpg" width="258" height="146" 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="money-master.jpg" width="258" height="146" alt="Сайт о заработке в интернете">
</center>
</body>
</html>
Если у вас вместо картинки показывается "крестик" или картинки не видно ,
то значит вы допустили одну из распространенных ошибок:
- сохранили файл не в той же папке, где находится html-файл.
- сохранили файл под другим именем, например не верно указали расширение файла.
Должно быть jpg
- возможно файл сохранился как money-master.jpg.jpg (Зайдите в папку где лежат
файлы через TotalCommander и проверьте. При необходимости переименуйте)
- допустили ошибку в параметре, написав например scr= вместо src=
- не верно указали имя файла или расширение после src=
Также перечитайте вот эту тему на форуме. Там разбираются все возможные ошибки при вставке картинки.
Урок 5. Форматирование текста жирным и курсивом.
Урок 6. Изменяем размер шрифта.
Урок 7. Делаем ссылки на другие страницы/сайты.
Урок 8. Таблицы. Как делать таблицы. Параметры таблиц.
Урок 9. Пример создания 2х-страничного сайта.