Главная | Обратная связь | Поможем написать вашу работу!

Форматирование текста

Стр 1 из 4Следующая ⇒

Работа 1

Основы языка HTML

Цель работы – изучить основные элементы языка создания Web-документов.

Задача работы – создать гипертекстовый документ.

Порядок выполнения работы

1. Изучить теоретический материал.

2. Выполнить упражнения 1.1 … 1.9.

3. Создать собственный Web-документ, включающий гипертекстовые ссылки, рисунок, список, таблицу.

Содержание отчета

1. Титульный лист, название, цель и задание на лабораторную работу.

2. Краткая теоретическая часть:

· структура языка HTML;

· элементы HTML (гипертекстовые ссылки, Web-графика, форматирование, списки, таблицы);

· таблицы стилей.

3. Текст созданного Web-документа на языке HTML и вид страницы.

Пояснения к выполнению работы

Web-сайт хранит информацию в виде страниц, которые просматривают его посетители. Каждая такая страница (Web-page) должна быть описана в виде текстового файла на языке HTML (Hypertext Markup Language – язык разметки гипертекста). Получая этот файл, браузер воспроизводит на его основе информацию в соответствии с указанной разметкой.

Для создания Web-документов можно использовать текстовый редактор (или процессор), который обеспечивает сохранение текста в формате "только текст", без специальных кодов форматирования. Например, при работе в редакторе WordPad или NotePad (Блокнот), следует в меню Файл выбрать команду Сохранить как..., а в появившемся окне — опцию Текстовый документ из списка Тип файла. Файлы должны иметь расширение html или htm. Стандартная процедура создания Web-страницы состоит из следующих этапов: набор текста HTML-файла в текстовом редакторе, сохранение его с расширением html (htm), проверка правильности отображения в интернет-браузере.

Теги HTML

Документ, написанный на языке HTML, состоит из основного текста и управляющих символов – тегов (дескрипторов). Все теги HTML заключаются в угловые скобки (< >). Многие теги являются парными, т.е. состоят из стартового и завершающего (т.н. контейнер).

Чтобы Web-браузер верно распознал страницу, ее код должен начинаться тегом <HTML> и заканчиваться тегом </HTML>. Как видно, завершающий тег отличается от стартового наличием слэша / (символа «косая черта»).

Для передачи Web-браузеру информации о примененном при создании документа стандарте HTML перед тегом <HTML> указывается тег <DOCTYPE. Например, при использовании HTML версии 3.2, вставляется тег

<DOCTYPE HTML PUBLIC “-//W3C/DTD HTML 3.2//EN”>.

Как правило, HTML-текст Web-страницы состоит из нескольких блоков. Первый из них – заголовок – выделяется тегами <HEAD> и </HEAD>. В этом блоке содержится заглавие страницы, а также сведения о кодировке, описание содержания страницы, ключевые слова и сведения об авторе. Текст заглавия появляется в строке заголовка Web-браузера при выводе страницы на экран. Он используется также поисковыми системами Интернет, такими как Yahoo, AltaVista или Rambler. Заглавие устанавливается с помощью тегов <TITLE> и </TITLE>. Для указания кодовой страницы символов, которая использовалась при создании Web-страницы, применяется тег <META> и параметр http-equiv = "Content-Type". Например, для указания кириллической кодировки windows-1251 надо написать:

<META http-equiv="Content-Type" content="text/html; charset=windows-1251">.

Для индексации и каталогизации Web-страницы поисковыми серверами (например, Yahoo!, Lycos, Infoseek и др.) можно использовать тег <META> и параметр name="description" с описанием содержимого страницы. Например: <META name="description" content= "Официальный сайт фирмы EuroRobot, занимающейся разработкой промышленных роботов">. Аналогично можно добавить ключевые слова и имя автора страницы:

<META NAME="keywords" content="Ключевые слова">;

<META NAME="author" content="Имя автора">.

Тело Web-страницы ограничивается тегами <BODY> и </BODY>. В теге <BODY> можно использовать ряд ключевых слов (атрибутов) для установки цвета текста, фона, гиперссылок и др. Например,

<body bgcolor="#FFFFCC" text="#660099" link="#FF3399" alink="#CC3333" vlink="#669966"> Тело страницы </body>,

где bgcolor="#FFFFCC" – цвет фона; text="#660099" – цвет текста; link="#FF3399" – цвет гиперссылок; alink="#CC3333" – цвет активных гиперссылок; vlink="#669966" – цвет посещенных ранее ссылок.

В примере значения цветов приведены в шестнадцатеричном виде в формате RGB-палитры - #RRGGBB: символ #, две первые цифры – интенсивность красной составляющей, следующие две – зеленой, последние две – синей. Основные цвета можно указывать названиями (BLACK, BLUE, GREEN и т.д.).

В другом примере в качестве фона используется рисунок с именем picture1.gif - <body background="picture1.gif">Тело страницы</body>.

Подытоживая данный параграф, приведем структуру Web-страницы:

<DOCTYPE HTML PUBLIC “-//W3C/DTD HTML 3.2//EN”>

<HTML>

<HEAD>

<TITLE>Заглавие</TITLE >

<META http-equiv="Content-Type" content="text/html; charset= windows-1251">

<META name="description" content="Содержимое Web-страницы">

<META NAME="keywords" content="Ключевые слова">

<META NAME="author" content="Имя автора">

</HEAD>

<BODY bgcolor="цвет" text="цвет" link="цвет" alink="цвет" vlink="цвет">

Тело документа

</BODY>

</HTML>

Форматирование текста

Основные теги, используемые для форматирования символов Web-страницы, приведены в табл. 3. Каждый из указанных тегов является контейнером, т.е. соответствующее форматирование начинается стартовым тегом, а заканчивается – завершающим.

Таблица 3

12 3 4 Следующая ⇒