Организация ссылок.
Тег <A> является одним из важных элементов HTML и предназначен для создания ссылок (якорей).
Ссылки являются основой гипертекстовых документов и позволяют переходить с одной web-страницы на другую. Особенность ссылки состоит в том, что она может указывать не только на html-файл, но и на файл любого типа, причем этот файл может размешаться совсем на другом сайте. Главное, чтобы к файлу, на который делается ссылка, был доступ. Если ссылка ссылается на часть контента внутри страницы, то она называется якорем.
Параметры:
Href - Задает адрес документа, на который следует перейти.
Name - Устанавливает имя якоря внутри документа. Правильное оформление якоря:
<a href=”#nachalo”> Начало </a>
…
<a name=”#nachalo”> Начало </a>
Target - Имя окна или фрейма, куда браузер будет загружать документ.
_blank — загружает страницу в новое окно браузера.
_self — загружает страницу в текущее окно (по умолчанию).
Title - Добавляет всплывающую подсказку к тексту ссылки.
Задание.
Изменить файлIndex.html создав таблицу из 2-х строк и 3-х столбцов (объединив ячейки верхней строки) и поместить содержимое, как представлено на рисунке.
Создать две странички stix1.html и stix2.html, используя дизайн и структуру Index.html. Содержимым для 2-ой ячейки 2-ой строки страницы stix1.html будет:
Я помню чудное мгновенье:
Передо мной явилась ты,
Как мимолетное виденье,
Как гений чистой красоты
В томленьях грусти безнадежной
В тревогах шумной суеты,
Звучал мне долго голос нежный
И снились милые черты.
Шли годы. Бурь порыв мятежный
Рассеял прежние мечты,
И я забыл твой голос нежный,
Твой небесные черты.
В глуши, во мраке заточенья
Тянулись тихо дни мои
Без божества, без вдохновенья,
Без слез, без жизни, без любви.
Душе настало пробужденье:
И вот опять явилась ты,
Как мимолетное виденье,
Как гений чистой красоты.
И сердце бьется в упоенье,
И для него воскресли вновь
И божество, и вдохновенье,
И жизнь, и слезы, и любовь.
Для страницы stix2.html, соответственно:
Я вас любил: любовь еще, быть может,
В душе моей угасла не совсем;
Но пусть она вас больше не тревожит;
Я не хочу печалить вас ничем.
Я вас любил безмолвно, безнадежно,
То робостью, то ревностью томим;
Я вас любил так искренно, так нежно,
Как дай вам бог любимой быть другим.
В Index.html первые четверостишия стихов будут являться ссылка для перехода на страницы stix1.html и stix2.html. А на страницах stix1.html и stix2.html «Пушкин А.С.» должен быть ссылкой для возвращения на Index.html.
Контейнеры элементы div и span
В HTML существует специальный элемент DIV, который может служить контейнером для любых других элементов HTML. Элементы, помещенные внутрь тега DIV, отделяются от остальною содержимого страницы абзацным отступом. С помощью атрибута align можно задавать выравнивание содержимого контейнера. Например, если мы захотим для целой группы элементов задать выравнивание по центру, то можно сделать это, поместив их внутрь контейнера и задав выравнивание для всего контейнера в целом, а не для каждого его элемента отдельно.
<DIV align="center">
<Нl> Заголовок 1 </Нl>
<Н2> Заголовок 2 </Н2>
<НЗ> Заголовок 3 </Н3>
<Н4> Заголовок 4 </Н4>
<Н5> Заголовок 5 </Н5>
<H6> Заголовок 6 </Н6></DIV>
<DIV> все заголовки будут выровнены по центру страницы. Это дает нам некоторые удобства и экономию в написании кода, а соответственно, и размер файла будет меньше. У контейнеров есть и другие области применения. Например, при использовании каскадных таблиц стилей и элемента DIV можно создавать блоки, задавать для них уникальные параметры оформления и позиционировать их на экране в нужное место.
Элемент SPAN, в отличие от элемента DIV, создает строчной блок. С его помощью можно вытащить не который фрагмент текста и потом задать для него своеобразное оформление при помощи каскадных таблиц стилей.
Задание.
Используя контейнер div для выравнивания текста на странице index.html по всей длине и для выравнивания по центру фотографий на странице Foto.html