Вставляем на сайт картинкуДопустим вы решили вставить на сайт вот такую картинку : Сначала вам нужно сохранить эту картинку у себя на компьютере. Для этого наведите курсор мышки на картинку и нажмите правую кнопку мышки. Выберите "Сохранить рисунок как..." Укажите место для сохранения картинки (Как я рекомендовал ранее - сделайте отдельную папку 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 - допустили ошибку в параметре, написав например scr= вместо src= - не верно указали имя файла или расширение после src=
Урок 5. Форматирование текста жирным и курсивом. Урок 6. Изменяем размер шрифта. Урок 7. Делаем ссылки на другие страницы/сайты. Урок 8. Таблицы. Как делать таблицы. Параметры таблиц. Урок 9. Пример создания 2х-страничного сайта.
|