Показать сообщение отдельно
Старый 15.03.2013, 14:56   #3 (permalink)
GRYZ
Member
 
Аватар для GRYZ
 
Регистрация: 01.03.2013
Сообщений: 533
Сказал(а) спасибо: 11
Поблагодарили 3 раз(а) в 2 сообщениях
Репутация: 801
По умолчанию

Добавляем ссылку и картинку на сайт.

Первое, что мы сделаем - это добавим HTML ссылку на нашу страницу.

Для этого напишем в теге <body> такой код:
Код:
 <a target = "_self" href = "index.html" title = "Ссылка">Ссылка на эту страницу</a>
Атрибут "target" может принимать значения "_self", "_new", "_blank"
Значение "_self" означает, что страница откроется в этом же окне.

Значение "_new" означает, что страница откроется в новом окне (некоторые браузеры открывают не новое окно, а создают новую вкладку в браузере).

Значение "_blank" означает, что страница будет открыта в новой вкладке.

Я настоятельно рекомендую Вам испробовать все значения этого атрибута в различных браузерах, чтобы окончательно понять, что каждое из них означает.
Следующий атрибут "href" означает путь к странице. Так как нам пока ссылаться не на что, то приходится сослаться на ту же страницу. Что касается формы записи, то здесь бывают абсолютные и относительные пути.

Абсолютный путь задаёт полный путь к файлу, например, так: "http://mysite.ru/images/image1.gif". А относительный путь указывают путь относительно каталога, в котором находится текущий файл. Например, наш файл "index.html" лежит в корне сервера, а мы пишем: "href = 'images/image1.gif'". Это означает то же самое, что и если бы мы написали: "http://mysite.ru/images/image1.gif". Это, что касается абсолютных и относительных путей.

Надеюсь, что с атрибутом "href" всё стало понятно. Разумеется, ссылаться можно не только на HTML-страницы, но и на любые файлы, будь то картинки, будь то фильмы, будь то музыка, будь то архивы, будь то ещё всё, что угодно.

Последний атрибут - это "title". Здесь всё совсем просто. Этот атрибут задаёт текст, который будет виден при наведении мышки на ссылку.
Теперь добавим изображения, но прежде, чем это делать. Сразу после добавления HTML-ссылки ставим тег "</br>". Этот тег также является одиночным, и он означает переход на новую строку. Напишем в теге <body> такой код:
Код:
 <img src = "image1.gif" alt = "Картинка" width = "100" height = "100">
Тег <img> означает, что мы хотим добавить здесь изображение. Этот тег, как видно, является одиночным, то есть у него нет закрывающего тега. Атрибуты тега также очень и очень простые.

Атрибут "src" указывает путь к картинке. Опять же можно указывать, как абсолютный путь, так и относительный путь, в зависимости от ситуации.

Атрибут "alt" указывает текст, который описывает картинку. Этот же текст будет показываться в случае, если картинка по каким-либо причинам будет не найдена, либо у пользователя в браузере отключён показ картинок.
Атрибуты "width" и "height" указывают ширину и высоту картинки соответственно. Если их не указывать, то картинка будет иметь такой размер, какой имеет исходник.
Можете создать папку img в том же каталоге где лежит index.html и закидывать туда картинки. А в атрибуте "src" пишите значение "http://www.tehnari.ru/images/Имя файла картинки".
А пока код выглядит так:
Код:
 <html>
<head>
</head>
<body text = "green" bgcolor = "yellow" link = "green" vlink = "red" alink = "blue">
  <h1>Заголовок</h1>
  <a target = "_new" href = "index.html" title = "Ссылка">Ссылка на эту страницу</a>
  </br>
  <img src = "image1.gif" alt = "Картинка" width = "100" height = "100">
</body>
</html>
GRYZ вне форума   Ответить с цитированием
Ads

Яндекс

Member
 
Регистрация: 31.10.2006
Сообщений: 40200
Записей в дневнике: 0
Сказал(а) спасибо: 0
Поблагодарили 0 раз(а) в 0 сообщениях
Репутация: 55070