СОЗДАНИЕ WEB-СТРАНИЦ С ПОМОЩЬЮ OpenOffice.org. ТЭГИ (дескрипторы) – это команды, определяющие внешний вид Web – документа и формирующие связи с другими. - презентация

1 СОЗДАНИЕ WEB-СТРАНИЦ С ПОМОЩЬЮ OpenOffice.org

2 ТЭГИ (дескрипторы) – это команды, определяющие внешний вид Web – документа и формирующие связи с другими Web – ресурсами.

3 Существует два способа создания Web – страниц: 1) «вручную», посредством набора тэгов с помощью простейших текстовых редакторов (например, Блокнота); 2) с помощью визуальных HTML – редакторов (Microsoft Front- Page, Macromedia Dreamwaver, Microsoft Word и других).

4 Файлы с Web – содержимым обычно имеют расширение.htm. или.html.

5 Основные тэги HTML НазначениеФормат Структура Web-страницы Начало и конец страницы Описание страницы, в том числе ее имя Имя страницы Содержание страницы Форматирование текста Заголовок (уровни от 1 до 6) Абзац Абзац с выравниванием Перевод строки Горизонтальный разделитель Выравнивание по центру Нумерованный список Ненумерованный список Форматирование шрифта Жирный Курсив Подчеркнутый Верхний индекс Нижний индекс Размер шрифта (от 1 до 7) Цвет шрифта (задается названием цвета или его 16-ричным кодом) Гарнитура шрифта

6 Атрибуты задания цветовой схемы(цвета фона, текста и гиперссылок) цветкодназваниецветкодназвание черный# blackфиолетовый# FF00FFmagenta белый# FFFFFFwhiteбирюзовый# 00FFFFcyan красный# FF0000redжелтый# FFFF00yellow зеленый# 00FF00limeзолотой# FFD800gold синий# 0000FFblueоранжевый# FFA500orange серый# grayкоричневый# A82828brown

7 ПРАКТИЧЕСКАЯ РАБОТА. 1. Откройте текстовый редактор в OpenOffice.org. 2. Нажмите файл – создать – документ html. 3. На рабочем столе создайте папку с названием OOSite. 4. Сохраните файл в папку OOSite, дав ему название index.html 5. В папке OOSite создадим папку для рисунков, с именем images. 6. Cкопируем в эту папку картинку для фона, которую возьмём в галерее установленного пакета OpenOffice.org по адресу - C:\Program Files\OpenOffice.org 3\Basis\share\gallery\www-back\ice-light.jpg. 7. В нашем файле кликаем Формат – Страница – Фон, далее, тип фона выбираем Графический объект, и по нажатии на кнопку Обзор, переходим в папку нашего проекта – images, где выбираем файл, который Вы выбрали - ice-light.jpg. И кликаем последовательно кнопки Открыть и OK. 8. Жмём в меню: Вставка - Таблицу, и в новом окне выбираем один столбец и одну строку, далее кликаем OK. 9. Выделив таблицу кликаем в меню: Таблица - Свойства таблицы. 10. Во вкладке Таблица – в правой части, выбираем выравнивание По центру. В настройках ширины выбираем – Относительная, и задаём ширину в процентах – в нашем случае – 60%. 11. Переходим к вкладке На странице, здесь мы настраиваем выравнивание содержимое таблицы. Выбираю По середине и перехожу к вкладке Обрамление, где настраивается тип рамки и её толщина, выбираю тип - одну линию и выбираю толщину рамки - 0,5 pt. Далее я задаю белый цвет фона таблицы на вкладке Фон. Жмём OK. 12. Вводим текст. 13. Между таблицей шапки сайта и таблицей контента необходимо сделать отступ. В силу того, что браузеры по-разному отрабатывают теги перевода строки, отступ между таблицами сделаем с помощью дополнительной таблицы. У этой, дополнительной таблицы, уберём рамку, чтобы она не отображалась на странице браузера. 14. Теперь выставляем курсор ниже разделительной таблицы и добавляем новую таблицу, кликнув последовательно на кнопки меню: Таблица - Вставить - Таблица. В появившемся окне, выбираем одну строку и один столбец. Таблица для контента создана, теперь её нужно отредактировать. Кликаем в таблицу курсором мышки и выбираем в меню: Таблица - Свойства таблицы. Открывается окно редактирования таблицы, где мы задаём ширину таблицы 80%, фон таблицы Белый, рамка одинарная, с линией, толщиной 0,5 pt. Жмём кнопку OK и Сохранить. 15. Вводим текст. 16. Сохраняем нашу web - страницу, нажав иконку Сохранить на панели управления редактора Writer. Чтобы просматривать результат нашей работы. Откроем файл index.html с помощью браузера, например Internet Explorer.