![]() Главная страница Случайная страница КАТЕГОРИИ: АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника |
Задание. Задание 1. Создание простейшей Web-страницы. ⇐ ПредыдущаяСтр 6 из 6
Задание 1. Создание простейшей Web-страницы. Порядок выполнения: 1. Запустите текстовый редактор Блокнот (Пуск ► Программы ► Стандартные ► Блокнот). 2. Введите следующий документ: < НТМL> < HEAD> < ТITLE> Заголовок документа< /TITLE> < /HEAD> < BODY> Содержание документа < /BODY> < /HTML> 3. Сохраните этот документ под именем < Ваша фамилия>.htm. Примечание. Обратите внимание, чтобы редактор Блокнот автоматически не сохранил Ваш файл с расширением .TXT (убедитесь, что сброшен флажок, что сброшен флажок Не показывать расширения для зарегистрированных типов файлов (Пуск ► Настройка ► Свойства папки ► Вид)). 4. Запустите программу Internet Explorer (Пуск ► Программы.► Internet Explorer). 5. Дайте команду Файл ► Открыть. Щелкните на кнопке Обзор и откройте файл < Ваша фамилия>.htm. 6. Посмотрите, как отображается этот файл - простейший корректный документ HTML.
Задание 2. Изучение приемов форматирования абзацев. Порядок выполнения: 1. Если это упражнение выполняется не сразу после предыдущего, откройте документ < Ваша фамилия>.htm в программе Блокнот. 2. Удалите весь текст, находящийся между тегами < BODY> и < /BODY>. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить после тега < BODY>, а его конкретное содержание может быть любым. 3. Введите заголовок первого уровня, заключив его между тегами < Н1> и < /Н1>. 4. Введите заголовок второго уровня, заключив его между тегами < Н2> и < /Н2>. 5. Введите отдельный абзац текста, начав его с тега < Р>. Пробелы и символы перевода строки можно использовать внутри абзаца произвольно. 6. Введите тег горизонтальной линейки < HR>. 7. Введите еще один абзац текста, начав его с тега < Р>. 8. Сохраните этот документ под именем < Ваша фамилия>.htm. 9. Запустите обозреватель Internet Explorer (Пуск ► Программы ► Internet Explorer). 10. Дайте команду Файл ► Открыть. Щелкните на кнопке Обзор и откройте Ваш файл. 11. Посмотрите, как отображается этот файл. Установите соответствие между элементами кода HTML и фрагментами документа, отображаемыми на экране.
Задание 3. Создание гиперссылок. Порядок выполнения: 1. Если это упражнение выполняется не сразу после предыдущего, откройте документ < Ваша фамилия>.htm в программе Блокнот. 2. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами < BODY> и < /BODY>. 3. Введите фразу: Текст до ссылки. 4. Введите тег: < А HREF=" https:///www.ugatu.ac.ru" >. 5. Введите фразу: Ссылка. 6. Введите закрывающий тег < /A>. 7. Введите фразу: Текст после ссылки. 8. Сохраните Ваш документ. 9. Запустите обозреватель Internet Explorer откройте Ваш файл. 10. Убедитесь в том, что текст между тегами < А> и < /А> выделен как ссылка (цветом и подчеркиванием). 11. Щелкните на ссылке и убедитесь, что при этом загружается документ, на который указывает ссылка. 12. Щелкните на кнопке Назад на панели инструментов, чтобы вернуться к предыдущей странице. Убедитесь, что ссылка теперь считается «просмотренной» и отображается другим цветом.
Задание 4. Создание изображения и использование его на Web-странице. Порядок выполнения: 1. Откройте программу Paint (Пуск ► Программы ► Стандартные ► Paint). Задайте размеры нового рисунка, например 50x50 точек (Рисунок ► Атрибуты). 2. Нарисуйте произвольный рисунок. 3. Сохраните рисунок под именем < Ваша фамилия>.gif (в формате GIF). 4. Откройте документ < Ваша фамилия>.htm в программе Блокнот. 5. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами < BODY> и < /BODY>. 6. Введите тег < IMG SRC =" < Ваша фамилия>.gif" ALIGN=" LEFT" >. 7. Сохраните Ваш документ. 8. Запустите обозреватель Internet Explorer откройте Ваш файл. Посмотрите на получившийся документ, обращая особое внимание на изображение. 9. Вернитесь в программу Блокнот и, измените значение атрибуту: ALIGN=" CENTER". Сохраните файл под тем же именем. 10. Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как изменился вид страницы при изменении атрибутов. 11. Вернитесь в программу Блокнот и добавьте в тег < IMG> атрибуты: HSPACE=40 VSPACE=20. Сохраните файл под тем же именем. 12. Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как изменился вид страницы при изменении атрибутов.
Задание 5. Приемы форматирования текста. Порядок выполнения: 1. Если это упражнение выполняется не сразу после предыдущего, откройте документ < Ваша фамилия>.htm в программе Блокнот. 2. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами < BODY> и < /BODY> 3. Введите тег < FONT SIZE=" 5" COLOR=" BROWN" >. Он задает вывод текста увеличенным шрифтом и коричневым цветом. 4. Введите произвольный абзац текста, который будет выводиться шрифтом, заданным по умолчанию. Начните этот абзац с тега < Р>. и закончите его тегом < /FONT>. 5. Введите теги: < Р> < FONT SIZE=" -2" FACE=" ARIAL" COLOR=" GREEN" >. 6. Введите очередной абзац текста, закончив его тегом < /FONT>. 7. В следующем абзаце используйте по своему усмотрению парные теги: < В> (полужирный шрифт), < I> (курсив), < U> (подчеркивание), < S> (вычеркивание), < SUB> (нижний индекс), < SUP> (верхний индекс). 8. В следующем абзаце используйте по своему усмотрению парные теги < ЕМ> (выделение), < STRONG> (сильное выделение), < CODE> (текст программы), < КВО> (клавиатурный ввод), < SAMP> (пример вывода), < VAR> (компьютерная переменная). 9. Сохраните Ваш документ. 10. Запустите обозреватель Internet Explorer откройте Ваш файл. Изучите, как использованные элементы HTML влияют на способ отображения текста. 11. Вернитесь в программу Блокнот и измените документ так, чтобы элементы, задающие форматирование, были вложены друг в друга. Сохраните документ под тем же именем. 12. Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как изменился вид страницы.
Задание 6. Приемы создания списков. Порядок выполнения: 1. Если это упражнение выполняется не сразу после предыдущего, откройте документ < Ваша фамилия>.htm в программе Блокнот. 2. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами < BODY> и < /BODY> 3. Вставьте в документ тег < OL ТУРЕ=" I" >, который начинает упорядоченный (нумерованный) список. 4. Вставьте в документ элементы списка, предваряя каждый из них тегом < LI>. 5. Завершите список при помощи тега < /OL>. 6. Сохраните Ваш документ. 7. Запустите обозреватель Internet Explorer откройте Ваш файл. Изучите, как упорядоченный список отображается в программе Internet Explorer, обращая особое внимание на способ нумерации, заданный при помощи атрибута TYPE=. 8. Вернитесь в программу Блокнот и установите текстовый курсор после окончания введенного списка. 9. Вставьте в документ тег < UL TYPE=" SQUARE" >, который начинает неупорядоченный (маркированный) список. 10. Вставьте в документ элементы списка, предваряя каждый из них тегом < LI>. 11. Завершите список при помощи тега < /UL>. Сохраните Ваш документ. 12. Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как изменился вид страницы, обратив внимание на способ маркировки, заданный при помощи атрибута TYPE=. 13. Вернитесь в программу Блокнот и установите текстовый курсор после окончания введенного списка. 14. Вставьте в документ тег < DL>, который начинает список определений. 15. Вставьте в список определяемые слова, предваряя соответствующие абзацы тегом < DТ>. 16. Вставьте в список соответствующие определения, предваряя их тегом < DD>. 17. Завершите список при помощи тега < /DL>. Сохраните Ваш документ. 18. Вернитесь в программу Internet Explorer и щелкните на кнопке Обновить на панели инструментов. Посмотрите, как выглядит при отображении Web-страницы список определений. Задание7. Создание таблиц. Порядок выполнения: 1. Если это упражнение выполняется не сразу после предыдущего, откройте документ < Ваша фамилия>.htm в программе Блокнот. 2. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить между тегами < BODY> и < /BODY>. В данном упражнении используется список номеров телефонов. 3. Введите тег < TABLE BORDER=" 10" WIDTH=" 100%" >. 4. Введите строку < CAPTION АLIGN=" TOP" > Список телефонов< /САРТION>. 5. Первая строка таблицы должна содержать заголовки столбцов. Определите ее следующим образом: < TR BGCOLOR=" YELLOW" ALIGN=" CENTER" > < ТН> Фамилия< ТН> Номер телефона 6. Определите последующие строки таблицы, предваряя каждую из их тегом < TR> и помещая содержимое каждой ячейки после тега < TD>. 7. Последнюю строку таблицы задайте следующим образом: < TR> < TD ALIGN=" CENTER" COLSPAN=" 2" > Ha первом этаже здания имеется бесплатный телефон-автомат. 8. Завершите таблицу тегом < /TABLE>. 9. Сохраните Ваш документ. 10. Запустите обозреватель Internet Explorer откройте Ваш файл. Изучите, как созданная таблица отображается в программе Internet Explorer, обращая особое внимание на влияние заданных атрибутов.
|