- •Лабораторная работа Создание Web-страницы
- •Лабораторная работа
- •1. Структура документа html
- •2. Элементы html
- •3. Функциональные блочные элементы
- •4. Гипертекстовые ссылки
- •6. Форматирование текста
- •7. Списки
- •8. Таблицы
- •9. Отображение нескольких документов
- •10. Интерактивные Web-страницы
- •11. Таблица наиболее часто используемых тегов
- •Задание
- •Задание 2. Изучение приемов форматирования абзацев.
- •Задание 3. Создание гиперссылок.
- •Задание 5. Приемы форматирования текста.
- •Форма отчетности
- •Контрольные вопросы:
Задание 5. Приемы форматирования текста.
Порядок выполнения:
Если это упражнение выполняется не сразу после предыдущего, откройте документ <Ваша фамилия>.htm в программе Блокнот.
Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами <BODY> и </BODY>
Введите тег <FONT SIZE="5" COLOR="BROWN">. Он задает вывод текста увеличенным шрифтом и коричневым цветом.
Введите произвольный абзац текста, который будет выводиться шрифтом, заданным по умолчанию. Начните этот абзац с тега <Р>. и закончите его тегом </FONT>.
Введите теги: <Р> <FONT SIZE="-2" FACE="ARIAL" COLOR="GREEN">.
Введите очередной абзац текста, закончив его тегом </FONT>.
В следующем абзаце используйте по своему усмотрению парные теги: <В> (полужирный шрифт), <I> (курсив), <U> (подчеркивание), <S> (вычеркивание), <SUB> (нижний индекс), <SUP> (верхний индекс).
В следующем абзаце используйте по своему усмотрению парные теги <ЕМ> (выделение), <STRONG> (сильное выделение), <CODE> (текст программы), <КВО> (клавиатурный ввод), <SAMP> (пример вывода), <VAR> (компьютерная переменная).
Сохраните Ваш документ.
Запустите обозреватель Internet Explorer откройте Ваш файл. Изучите, как использованные элементы HTML влияют на способ отображения текста.
Вернитесь в программу Блокнот и измените документ так, чтобы элементы, задающие форматирование, были вложены друг в друга. Сохраните документ под тем же именем.
Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как изменился вид страницы.
Задание 6. Приемы создания списков.
Порядок выполнения:
Если это упражнение выполняется не сразу после предыдущего, откройте документ <Ваша фамилия>.htm в программе Блокнот.
Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами <BODY> и </BODY>
Вставьте в документ тег <OL ТУРЕ="I">, который начинает упорядоченный (нумерованный) список.
Вставьте в документ элементы списка, предваряя каждый из них тегом <LI>.
Завершите список при помощи тега </OL>.
Сохраните Ваш документ.
Запустите обозреватель Internet Explorer откройте Ваш файл. Изучите, как упорядоченный список отображается в программе Internet Explorer, обращая особое внимание на способ нумерации, заданный при помощи атрибута TYPE=.
Вернитесь в программу Блокнот и установите текстовый курсор после окончания введенного списка.
Вставьте в документ тег <UL TYPE="SQUARE">, который начинает неупорядоченный (маркированный) список.
Вставьте в документ элементы списка, предваряя каждый из них тегом <LI>.
Завершите список при помощи тега </UL>. Сохраните Ваш документ.
Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как изменился вид страницы, обратив внимание на способ маркировки, заданный при помощи атрибута TYPE=.
Вернитесь в программу Блокнот и установите текстовый курсор после окончания введенного списка.
Вставьте в документ тег <DL>, который начинает список определений.
Вставьте в список определяемые слова, предваряя соответствующие абзацы тегом <DТ>.
Вставьте в список соответствующие определения, предваряя их тегом <DD>.
Завершите список при помощи тега </DL>. Сохраните Ваш документ.
Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как выглядит при отображении Web-страницы список определений.
Задание7. Создание таблиц.
Порядок выполнения:
Если это упражнение выполняется не сразу после предыдущего, откройте документ <Ваша фамилия>.htm в программе Блокнот.
Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами <BODY> и </BODY>. В данном упражнении используется список номеров телефонов.
Введите тег <TABLE BORDER="10" WIDTH="100%">.
Введите строку <CAPTION АLIGN="TOP">Список телефонов</САРТION>.
Первая строка таблицы должна содержать заголовки столбцов. Определите ее следующим образом:
<TR BGCOLOR="YELLOW" ALIGN="CENTER">
<ТН>Фамилия<ТН>Номер телефона
Определите последующие строки таблицы, предваряя каждую из их тегом <TR> и помещая содержимое каждой ячейки после тега <TD>.
Последнюю строку таблицы задайте следующим образом:
<TR><TD ALIGN="CENTER" COLSPAN="2">Ha первом этаже здания
имеется бесплатный телефон-автомат.
Завершите таблицу тегом </TABLE>.
Сохраните Ваш документ.
Запустите обозреватель Internet Explorer откройте Ваш файл. Изучите, как созданная таблица отображается в программе Internet Explorer, обращая особое внимание на влияние заданных атрибутов.