Давайте рассмотрим такой момент, допустим, вы нашли на каком либо ресурсе подходящую картинку нужной вам тематики, сначала вам нужно скопировать и сохранить эту картинку у себя на компьютере
Для этого наведите курсор на картинку и нажмите правую кнопку мышки. Выберите «Сохранить рисунок как…» Укажите место для сохранения картинки. Сохраните картинку в этой же директории, где находится файл вашей странички.
Имя файла картинки оставьте то же самое, в нашем примере это dollars.gif
Для вставки картинки – применяется тег <img> , в паре с параметром src указывающим имя файла – картинки.
Пример написания кода: <img src=”dollars.gif ”>
<html>
<head>
<title>Online обучение: HTML</title>
</head>
<body bgcolor= ”#00CCFF” text=”#FFFF00”>
<center>
<table border=”1” width=”300” height=”250” >
<tr><td>
<center>
<font size=”4”> <P>Я изучаю язык разметки (маркировки) гипертекста – HTML. Он мне нужен для создания персонального сайта.</P><font><br><br>
<img src=”dollars.gif ”>
<font size=”3”> <P>Это мой первый опыт по созданию интернет странички. Я хочу создавать свои сайты и получать пассивный доход в интернете. </P><font>
</center>
</td></tr>
</table>
</center>
</body>
</html>
Обратите внимание. Так как картинка анимационная, то расширение у ней стоит gif , у простой будет расширение jpg . Tеги <br><br> добавлены для того, что бы увеличить пробел между картинкой и последней строкой текста. Если сказать проще, то опустить картинку на несколько строк ниже.
Лучше всего указать размер картинки. Для чего применяются параметры width (ширина картинки) и height (высота картинки), которые измеряются в пикселях.
Пример: <img src=”dollars.gif ” width=”200” height=”200”>
так мы прописываем картинку, если она находится в одной директории с файлом шаблона вашей странички.
Если же картинок достаточно много, то лучше создать папку и назвать ее images или img. Об этом уже упоминалось выше, когда мы создавали фон в виде картинки.
Пример написания будет выглядеть так:
<img src=”images/dollars.gif ” width=”200” height=”200”>
Если вы применяете одну и ту же картинку, допустим свое фото, на разных ресурсах, то лучше всего, в корневой папке вашего домена, создать папку с дополнительными материалами. Назвать ее dopmat.
В этой папке создать тематические папки, например: video, music, images и тогда уже адрес вашей картинки (фотографии) будет прописываться вот так:
<img src=”http://ваш домен/dopmat/images/dollars.gif ” width=”200” height=”200”>
<html>
<head>
<title>Online обучение: HTML</title>
</head>
<body bgcolor=”#00CCFF” text=”#FFFF00”>
<center>
<table border=”1” width=”300” height=”250” >
<tr><td>
<center>
<font size=”4”> <P>Я изучаю язык разметки (маркировки) гипертекста – HTML. Он мне нужен для создания персонального сайта.</P><font>
<br><br>
<img src=”http://ваш домен/dopmat/images/dollars.gif ” width=”200” height=”200”>
<font size=”3”> <P>Это мой первый опыт по созданию интернет странички. Я хочу создавать свои сайты и получать пассивный доход в интернете. </P><font>
</center>
</td></tr>
</table>
</center>
</body>
</html>
Если вы хотите что бы при наведении курсора на картинке появлялся текст, то это осуществляется с помощью параметра titl <img src=”images/dollars.gif ” width=”200” height=”200” title=”Заработай в интернете” >
<html>
<head>
<title>Online обучение: HTML</title>
</head>
<body bgcolor=”#00CCFF” text=”#FFFF00”>
<center>
<table border=”1” width=”300” height=”250” >
<tr>
<td>
<center>
<font size=”4”> <P>Я изучаю язык разметки (маркировки) гипертекста – HTML. Он мне нужен для создания персонального сайта.</P><font>
<br><br>
<img src=”http://ваш домен/dopmat/images/dollars.gif ” width=”200” height=”200” title=”Заработай в интернете” >
<font size=”3”> <P>Это мой первый опыт по созданию интернет странички. Я хочу создавать свои сайты и получать пассивный доход в интернете. </P><font>
</center>
</td>
</tr>
</table>
</center>
</body>
</html>