Главная страница Случайная лекция
Мы поможем в написании ваших работ!
Порталы:
БиологияВойнаГеографияИнформатикаИскусствоИсторияКультураЛингвистикаМатематикаМедицинаОхрана трудаПолитикаПравоПсихологияРелигияТехникаФизикаФилософияЭкономика
Мы поможем в написании ваших работ!
Этап 1. Изучение основных конструкций языка HTML
Задание на лабораторную работу
1. Ознакомьтесь с теоретическим материалом и основными тегами языка
HTML.
2. В своей папке создайте папку Site. Здесь будут размещаться все файлы
проекта.
3. Запустите текстовый редактор Блокнот. Создайте типовую структуру
HTML-документа:
<НТМ1_>
<HEAD>
<TITLE> </TITLE> </HEAD> <BODY> </BODY> </HTML>
Между тегами <TITLE> введите заголовок главной страницы: Путешествие по странам Европы.
4. Сохраните документ в папку Site. При сохранении в качестве типа фай
ла укажите Все файлы, в качестве имени файла index.html.
5. Закройте Блокнот. Найдите файл index.html и откройте его. Обратите
внимание, что на странице уже присутствует заголовок.
6. В главном меню браузера выполните команду Вид - В виде HTML. От
кроется Блокнот, где можно продолжить наполнение страницы.
7. Добавьте заголовком первого уровня фразу:
Добро пожаловать на страничку, посвященную странам Европы! Сохраните файл. Вернитесь в браузер и выполните команду Обновить. Оцените полученный результат.
8. Вернитесь к Блокноту. Создайте новый абзац. Задайте выравнивание
текста абзаца по ширине. В качестве текста абзаца введите следующее:
Здравствуйте, уважаемые путешественницы и путешественники! Если ваше собственное желание или судьба манят вас в дорогу - в новые страны, в экзотические места, в необычные путешествия, - загляните прежде на наш сайт. Загляните как в будущее, чтобы заранее узнать: что Вас ожидает за ближайшим поворотом, что Вам понадобится в дороге и о чем не вредно позаботиться заранее. Мы предлагаем Вашему вниманию полную, объективную и достоверную информацию о разных уголках Земли, о странах и путешествиях.
Слова «полную, объективную и достоверную» оформите курсивом.
Сохраните страницу, оцените полученный эффект. Далее без дополнительного напоминания просматривайте страницу по мере необходимости.
9. Добавьте к документу следующий абзац (настройки соответствуют
предыдущему абзацу):
Несмотря на то, что стран Европы огромное количество, мы по мере возможности попытаемся Вам рассказать обо всех этих странах. Так что на нашем сайте вас ждет рассказ о странах Европы, в том числе их краткая характеристика.
Слова «Рассказ о станах Европы» оформите курсивом.
10. Добавьте третий абзац:
К сожалению, в настоящий момент сайт находится в стадии разработки, поэтому еще далеко не все разделы доступны для просмотра. Мы искренне надеемся, что этот ресурс будет постоянно обновляться, и в ближайшем будущем многие странички займут свое законное место.
Слова «в стадии разработки» оформите полужирным начертанием.
11. Текст следующего абзаца расположите по центру и увеличьте размер
шрифта на один пункт. В качестве текста укажите:
Заходите на нашу страничку почаще!
12. Поставьте в качестве разделителя горизонтальную линию (толщина - 1
пиксель, ширина - 80% рабочего поля, цвет - черный). После тега горизонталь
ной линии вставьте разрыв строки.
13. Добавьте информацию об авторских правах. В конце страницы добавь
те абзац, выровненный по центру, с текстом (размер уменьшите на один пункт):
© Ваши инициалы и фамилия 2005, All Rights Reserved
Комбинация символов © в языке HTML означает отображение знака ©.
14. Отцентрируйте заголовок «Добро пожаловать на страничку, посвящен
ную странам Европы».
15. Первый вариант начальной страницы сайта должен выглядеть пример
но так, как представлено на рисунке 7.1.
Рисунок 7.1 - Примерный вид страницы после выполнения первого этапа
Этап 2. Установка свойств текста, использование списков, организация гиперссылок
Сначала необходимо внести изменения в созданную ранее web-страницу. Откройте файл index.html в текстовом редакторе Блокнот.
1. Измените цвет фона ("#FCEAD4") и не посещенных гиперссылок
("#014CA1") для всей страницы.
2. Измените гарнитуру шрифта в текстовых абзацах на Verdana. Установи
те для них высоту символов шрифта - 2 пункта.
3. Трижды сохраните получившийся шаблон web-страницы под именами
italy.html, france.html и germany.html. На первой из этих страничек будет размещен
рассказ об Италии, на второй - о Франции, на третьей - о Германии.
4. Исправьте заголовки новых страниц, например, Италия для страницы
Italy.html. Заголовок первого уровня поменяйте на заголовок второго уровня. В
качестве текста заголовка укажите: Италия. Вместо трех текстовых абзацев раз
местите надпись: Раздел находится в стадии разработки.
5. Соедините получившиеся странички гиперсвязями. После разделитель
ной горизонтальной черты главной страницы начните новый абзац, задайте
гарнитуру шрифта Verdana и высоту шрифта - 2 пункта.
В новом абзаце организуйте гиперссылки на страницы сайта. Внешне это будет выглядеть примерно так, как показано на рисунке 7.2. Таким образом, данный абзац содержит наименования всех четырех страниц сайта. Гиперссылками являются только три из них, поскольку Главная - это та страница, на которой мы находимся сейчас, и нет особенного смысла в организации такой «автоссылки».
Рисунок 7.2 - Внешний вид ссылок на странице
6. После окончания абзаца с гиперссылками поставьте еще одну раздели
тельную черту с теми же настройками.
7. Оформите фамилию и инициалы, указанные в нижней части страницы,
гиперссылкой на ваш почтовый ящик. Для этого в качестве параметра откры
вающего тега укажите следующее:
HREF="mailto:ваш_логин@доменное_имя_почтового_сервера".
8. Сделайте изменения, аналогичные описанным в пунктах 5-7, на стра
ницах для Италии, Франции и Германии.
9. Перейдите к редактированию странички italy.html. В первом абзаце
укажите следующее: На этой странице вы можете ознакомиться со следующими под
разделами:. Далее, создав новый абзац, перечислите подразделы документа, рас-
сказывающего о данной стране (все названия подразделов должны быть размещены в одном абзаце):
Географическое положение
Национальные особенности
Крупные города
10. Создайте абзац, содержащий первый подраздел документа. В качестве текста укажите следующее:
Италия - государство на юге Европы в центральной части Средиземноморья. Берега Италии омываются морями: на Западе - Лигурийским и Тирренским, на Юге - Ионическим, на Востоке - Адриатическим. Около 20% границ - сухопутные, проходят преимущественно по различным частям Альп. На Севере граничит с Францией, Швейцарией, Австрией, на Северо-Востоке - с Югославией. Территория Италии охватывает южные склоны Альп, Паданскую равнину, Апеннинский полуостров, острова Сицилию и Сардинию и многочисленные мелкие острова.
Перед абзацем добавьте текст Географическое положение и оформите его полужирным форматированием.
13. Создайте следующий абзац. В качестве текста укажите:
Этому причудливому ботфорту Европы есть чем похвастаться: религиозными и культурными деятелями, кукурузной кашей-полентой, знаменитыми памятниками архитектуры и своим политическим ребячеством. Его трехтысячелетняя история, культура и кухня могут покорить едва ли не каждого. В Италии можно посетить римские развалины, увидеть искусство ренессанса, побывать в крошечных средневековых городках на холмах, покататься на лыжах в Альпах, исследовать каналы Венеции и увидеть церкви, прекраснее которых трудно себе представить. Конечно, можно также насладиться и более простыми вещами: хорошей едой, вином, походами по магазинам и огромным выбором развлечений.
Перед абзацем аналогично предыдущему пункту добавьте подзаголовок Национальные особенности.
14. Создайте следующий абзац. В качестве текста введите:
Рим
Милан Неаполь Флоренция
Перед абзацем добавьте подзаголовок Крупные города.
Оформите абзац в виде маркированного списка (настройки шрифта аналогично всем текстовым абзацам).
15. Организуйте гиперссылки с перечня подразделов на соответствующие
части документа.
16. Просмотрите страницы проекта в браузере, проверьте корректность ра
боты гиперссылок.
| <== предыдущая страница | | | следующая страница ==> |
| Тема «Рекурсия» | | | Этап 3. Вставка изображений и таблиц |
Дата добавления: 2015-07-26; просмотров: 399; Нарушение авторских прав
Мы поможем в написании ваших работ!