- •Методичні вказівки
- •Застосування мови нтмl. Структура документа нтмl.
- •Елементи нтмl
- •Функціональні блокові елементи
- •Гіпертекстові посилання
- •WеЬ-графіка
- •Вивчення прийомів форматування абзаців
- •Створення гіперпосилань
- •Створення зображення і використання його на Web-сторінці
- •Лабораторна робота № 2 Прийоми форматування тексту, прийоми створення списків, створення таблиць, створення опису фреймів.
- •Стислі теоретичні відомості Форматування тексту
- •Таблиці
- •Відображення декількох документів
- •Робота в редакторі Frontpage Express
- •Створення і редагування документа
- •Порядок виконання лабораторної роботи Прийоми форматування тексту
- •Прийоми створення списків
- •Створення таблиць
- •Створення опису фреймів
- •Лабораторна робота № 3 Дослідження методів створення абзацного відступу в документах
- •Застосування майстрів і шаблонів
- •Публікація Web-документів
- •Порядок виконання лабораторної роботи
- •Лабораторна робота № 4 Візуальний редактор html Macromedia Dreamweaver mx Основні теоретичні відомості
- •Створення нового сайта в Dreamweaver. Палітра Site
- •Форматування тексту в Macromedia Dreamweaver mx
- •Робота з графічною інформацією в Dreamweaver mx
- •Робота з таблицями засобами Macromedia Dreamweaver
- •Зауваження:
- •Література
Вивчення прийомів форматування абзаців
Якщо ця вправа виконується не відразу після попередньої, відкрийте документ first.htm у програмі Блокнот.
Видалите весь текст, що знаходиться між тегами <BODY> і </BODY>. Текст, котрий буде вводитися в наступних пунктах цієї вправи, необхідно помістити після тега <BODY>, а його конкретний зміст може бути будь-яким.
Уведіть заголовок першого рівня, поклавши його між тегами <Н1 > і </Н1 >.
Уведіть заголовок другого рівня, поклавши його між тегами <Н2> і </Н2>.
Введіть окремий абзац тексту, почавши його з тега <Р>. Пробіли і символи переводу рядка можна використовувати усередині абзацу довільно.
Уведіть тег горизонтальної лінійки <HR>.
Уведіть ще один абзац тексту, почавши його з тега <Р>.
Збережіть цей документ під ім'ям paragraph.htm.
Запустіть обзорювач Internet Explorer (Пуск > Программы > Internet Explorer).
Дайте команду Файл > Открыть. Клацніть на кнопці Обзор і відкрийте файл paragraph.htm.
Подивіться, як відображається цей файл. Встановіть відповідність між елементами коду HTML і фрагментами документа, відображуваними на екрані.
Створення гіперпосилань
Якщо ця вправа виконується не відразу після попереднього, відкрийте документ first.htm у програмі Блокнот.
Видаліть весь текст, що знаходиться між тегами <BODY> і </BODY>. Текст, що буде вводитися в наступних пунктах цієї вправи, необхідно помістити після тега <BODY>.
Уведіть фразу: Текст до ссылки.
Уведіть тег: <А HREF="first.htm">.
Уведіть фразу: Ссылка.
Уведіть закриваючий тег </А>.
Уведіть фразу: Текст после ссылки.
Збережіть документ під ім'ям link.htm.
Запустіть обзорач Internet Explorer (Пуск > Программы > Internet Explorer).
Дайте команду Файл > Открыть. Клацніть на кнопці Обзор і відкрийте файл link.htm.
Переконаєтеся в тім, що текст між тегами <А> і </А> виділений як посилання (кольором і підкресленням).
Клацніть на посиланні і переконаєтеся, що при цьому завантажується документ, на котрий указує посилання.
Клацніть на кнопці Назад на панелі інструментів, щоб повернутися до попередньої сторінки. Переконаєтеся, що посилання тепер вважається «переглянутим» і відображається іншим кольором.
Створення зображення і використання його на Web-сторінці
Відкрийте програму Paint (Пуск > Программы > Стандартные > Paint). Задайте розміри нового малюнка, наприклад 50x50 точок (Рисунок > Атрибуты).
Виберіть червоний колір переднього плану і зелений колір заднього. Залийте малюнок фоновим кольором.
Інструментом Кисть нанесіть довільний червоний малюнок на зелений фон.
Збережіть малюнок під ім'ям picl .gif (у форматі GIF).
Дайте команду Рисунок > Атрибуты. Встановіть прапорець Использовать прозрачный цвет фона. Клацніть на кнопці Выбор цвета і виберіть зелений колір, уже використаний на малюнку в якості фонового.
Збережіть малюнок ще раз під ім'ям pic2.gif (у форматі GIF) і закрийте програму Paint.
Якщо ця вправа виконується не відразу після попередньої, відкрийте документ first. htm у програмі Блокнот.
Видалите весь текст, що знаходиться між тегами <BODY> і </BODY>. Текст, що буде вводитися в наступних пунктах цієї вправи, необхідно помістити після тега <BODY>.
Уведіть довільний текст (довжиною 4-5 рядків) і встановіть текстовий курсор у його початок.
Уведіть тег <IMG SRC="pic1 .gif" ALIGN="BOTTOM">.
Збережіть документ під ім'ям picture.htm.
Запустіть оглядач Internet Explorer (Пуск > Программы > Internet Explorer).
Дайте команду Файл > Открыть. Клацніть на кнопці Обзор і відкрийте файл picture.htm. Подивіться на документ, що вийшов, звертаючи особливу увагу на зображення.
Поверніться в програму Блокнот і змініть значення атрибута: ALIGN="TOP". Збережіть файл під тим же ім'ям.
Поверніться в програму Internet Explorer і клацніть на кнопці Обновить на панелі інструментів. Подивіться, як змінився вид сторінки при зміні атрибутів.
Поверніться в програму Блокнот і змініть значення атрибута: ALIGN="LEFT". Збережіть файл під тим же ім'ям.
Поверніться в програму Internet Explorer і клацніть на кнопці Обновить на панелі інструментів. Подивіться, як змінився вид сторінки при зміні атрибутів.
Поверніться в програму Блокнот і додайте в тег <IMG> атрибути: HSPACE=40
Поверніться в програму Internet Explorer і клацніть на кнопці Обновить на панелі інструментів. Подивіться, як змінився вид сторінки при зміні атрибутів.
Поверніться в програму Блокнот і змініть ім'я малюнка: SRC="pic2.gif". Збережіть файл під тим же ім'ям.
Поверніться в програму Internet Explorer і клацніть на кнопці Обновить на панелі інструментів. Подивіться, як змінився вид сторінки при зміні атрибутів. У чому розходження між двома створеними малюнками?
Зміст звіту
зміст повинен містити:
Мету роботи.
Опис виконання прийомів форматування абзацу.
Створення гіперпосилань.
Створення зображення і використання його на Web-сторінці.
Висновок.