Оформлення web-сторінок. Прийоми форматування тексту у web-документі: Методичні вказівки до лабораторного заняття № 3, страница 2

V. Логічне форматування. Форматування HTML-документа може бути фізичним або логічним. Теги логічного форматування сприймаються будь-яким браузером (Internet Explorer, Netscape Navigator  і ін.), тому й рекомендуються для використання. Теги жирного тексту <strong>, курсиву <em>, моношириного (фіксованого) шрифту <code> використовуються у логічному форматуванні, а відповідно <b>, <i>, <tt> - у фізичному.

Завдання 2. Створення та збереження файлів  

1.  Завантажте MS Word і створіть у ньому заголовок наведеного у завданні тексту Створення та форматування html документа , а також назви його п’яті пунктів, тобто створіть зміст. Збережіть документ у файлі format.docу папці гіпер *. Закрийте MS Word.

2.  Завантажте редактор Блокнот. Збережіть пустий документ з ім’ям format.html у папці гіпер *.

3.  Закрийте Блокнот.

Завдання 3. Створення простого документа  HTML

1.  Завантажте файл format.html.

2.  У програмі Internet Explorer виконайте команду Страница ► Просмотр HTML – кода.

3.  У редакторі Блокнот створіть наведений нижче документ HTML
<HTML>
<HEAD > <TITLE>  Форматування </TITLE> </HEAD>
<BODY>
Форматування
</BODY>
</HTML>

4.  Виконайте команди: Файл ►СохранитьВид ►Обновить. Прогляньте документ.

Завдання 4. Створення та редагування тексту

1.  Створіть заголовок тексту з вирівнюванням по центру. Для цього після тегу <body> перед заголовком Форматування  поставте тег <H1 align=center>, а після заголовку </H1>.

2.  Введіть у документі наведений нижче текст абзацу IV. Форматування. Кожний рядок наведеного тексту обривайте тегом <br>. Кожне речення виділіть в абзац.

3.  Виконайте команди: Файл ►СохранитьВид ► Обновить. Прогляньте документ.

Завдання 5. Форматування HTML документа

1.  Вслід за тегом < body > розташуйте тег, визначаючій шрифт, його розмір та колір:
<font face=”Microsoft Sans Serif” size=2 color=green>.

2.  Зробіть перше речення жирним, скориставшись тегом <b> - фізичне форматування

3.  Зробіть друге речення курсивом – фізичне форматування.

4.  Зробіть третє речення підкресленим.

5.  Для четвертого речення примініть збільшений шрифт, для п’ятого зменшений.

6.  У шостому реченні примініть для другого слова верхній індекс для четвертого – нижній.

7.  Сьоме речення відцентруйте.

8.  Восьме речення зробіть жирним, курсивом за допомогою тегів логічного форматування.

9.  Після останнього речення проведіть горизонтальну лінію.

Завдання 6. Створення фону HTML документу

1.  За допомогою атрибуту bgcolor зробіть фон документу сріблястим скориставшись відповідним англійським словом.

2.  Розташуйте нижче лінії підкреслення будь-яку картинку розміром 100х100.

Завдання 7. Створення гіперпосилань у Webдокументі

1.  Для заголовку HTML документу Форматування створіть гіперпосилання на файл рисунку. Виконайте гіперпосилання. Скопіюйте текст Форматування (не коди). Закрийте файли.

Завдання 8. Створення закладок та гіперпосилань у документі Word

1.  Завантажте файл format.doc. Виконайте вставку тексту з буферу обміну. Зніміть з тексту усе форматування. Зробіть для пункту змісту IV. Форматування гіперпосилання на файл format.html (команди Вставка►Гиперссылка). Виконайте гіперпосилання.

2.  Додайте в файл format.doc перший абзац тексту І. Структура. Зробіть для нього закладку за допомогою команд Вставка ► Закладка. Зробіть для пункту змісту І. Структура гіперпосилання на закладку. Виконайте гіперпосилання. Результати збережіть.