Структура документа
А структура документа такая. Весь документ заключён в парный тег < HTML > здесь содержание странички < /HTML > , который обозначает что всё что внутри этого тега браузеру необходимо интерпретировать. Внутри существуют ещё два больших элемента HEAD и BODY, тоже парные, требуют закрытия.
HEAD это раздел заголовка, в нём нужно описывать свойства документа в целом, такие как общий заголовок документа TITLE (это то что отображается в серой синей полоске вверху браузера), и некоторые другие полнее опишу позже, а теперь несколько слов о BODY.
BODY это так называемое тело документа, где и описывается всё содержимое странички. У тега BODY есть несколько атрибутов, а именно можно задать цвет вашей странички атрибутом bgcolor="x", x можно задать двумя способами, один это указание названия цвета по английски, например bgcolor="red", но можно указывать цвет и в шестнадцатеричной системе счисления, например bgcolor="#017D75", это уже как кому нравится. (не забывайте кавычки при указании значения атрибута обязательны).
Можно указать значение основного текста на страничке, атрибутом TEXT="x", X это значение цвета по любому из двух способов.
Можно так же в качестве фона использовать рисунок, для этого в BODY следует задать следующий атрибут: BACKGROUND="y", где y это путь к файлу фона, например fon.gif, но для этого этот файл должен находится в той же папке, что и страничка, на которую он загружается.
Можно так же зафиксировать фон на одном месте, как это сделано у меня, добавив атрибут: bgproperties="fixed". Так же можно указать цвета не просмотренных ссылок, атрибут LINK= , цвет активной ссылки (на которую наведён курсор), атрибут ALINK= , Цвет просмотренных ссылок, атрибут VLINK=.
Теперь о тегах для HEAD, тут можно и нужно указать название странички, при помощи парного тега TITLE, а так же различные META указания, для автоматических поисковых систем, а так же описать таблицы стилей, но это нужно изучать позже.
Средства оформления
Нужно ещё сказать о простейших средствах оформления документа.
Первый это заголовки, они отображаются парным тегом H1, или H2 или H3 и так далее, отличаются они только размером, а всего их 6. Можно выравнивать заголовки на страничке при помощи атрибута align="x", где x это RIGHT, СENTER, или LEFT, они выравнивают заголовок по правому краю по центру и по левому краю соответственно.
Можно влиять на свойства текста при помощи парного тега FONT, атрибутами которого являются SIZE=, размер текста. Color=, цвет текста. И атрибут FACE=, который указывает на шрифт которым должен отображаться текст.
Можно так же определить свойства текста в пределах абзаца при помощи парных тегов: < B > , этот тег делает текст полужирным, тег < I > определит наклонный текст, а тег < U > , подчеркнёт ваш текст, тег < S > текст зачеркнёт, Тег < BIG > и < SMALL >, увеличат или уменьшат текст соответственно. Для выделения текста курсивом используется тег < EM >.
Бывает что вам нужно описать текст какой то компьютерной программы, такой текст обычно должен выделятся по особому. Для этого существуют теги < CODE >, указывает, что текст это операторы программы. < SAMP > описывает вывод программы. < VAR > описывает компьютерные переменные или фрагменты программ.
Тег < BR >, тег перехода на другую строку. Этот тег может содержать атрибут CLEAR="X", где X это LEFT, RIGHT, ALL, эти значения атрибута указывают, что левое, правое или всё поле новой строки должны быть свободно, обычно этот атрибут применяют, при вставке изображений, для обтекания его текстом.
Так же можно задать индексы, например если вы хотите записать уравнение x2=4, то вам нужно задать верхний индекс, это делается при помощи тега < SUP >, можно так же создать нижний индекс, при помощи тега < SUB >.
Разметка документа
Текст может разбиваться на абзацы, при помощи тега < P >, этот тег хоть и парный но всё же закрывать его не обязательно, так как предполагается, что следующий тег < P >, будет и так же закрывающим, но при необходимости его можно закрыть.
Так же текст можно разбивать на логические разделы при помощи тега DIV, можно задать выравнивание текста раздела с помощью атрибута ALIGN=, значения атрибута рассматривались ранее.
Есть ещё один хитрый тег в HTML, позволяющий размещать на страничке не форматируемый текст, что это значит, а значит это то , что если вы в блокноте нарисуете при помощи ASCI графики треугольник, и попробуете вывести его на странице, то у вас получится следующее,
/\
/__\
А если вы используете этот тег, то вы увидите то что изобразили в блокноте:
/\
/__\
Достигается это при помощи не обработанного вывода заключенного в этом теге содержания, а записывается этот тег как < PRE >, это парный тег, то есть он требует закрытия.
Так же в HTML имеется возможность разбивать страничку линейками, подобными той, что вы можете увидеть ниже, делается это при помощи одиночного тега < HR >,
Линию можно изменить, то есть задать ширину, ври помощи атрибута WIDTH="X", где X это длинна линии в пикселях, или в процентах, относительно страницы, ниже линия с заданной длинной 50 пикселов
, так же можно задать ширину линии при помощи атрибута SIZE="x", где X это ширина в пикселах, Ниже линейка длинной 50 пикселов, и шириной 5
По умолчанию линейка создаётся, имитируя объем, чтоб отобразить её в монохроматическом цвете используется атрибут NOSHADE, Ниже пример линейки длинной 50, шириной 5 в монохроматическом цвете
Линию можно так же выровнять, при помощи атрибута ALIGN=, Значения атрибута стандартные, ниже пример той же линейки, выровненной вправо
Списки
Порой необходимо создать список чего либо, и для этого в HTML имеется возможность создавать списки, они специальным образом выделяются и маркируются.
Списки задаются специальными парными тегами, каждый элемент списка задаётся при помощи парного тега < LI >, однако закрывающий тег можно не указывать, так как следующий открывающий тег < LI >, закрывает предыдущий. В открывающем теге списка может употребляться атрибут TYPE=, который задаёт особенности маркировки списков.
Далее следует таблица, где отображены различные списки и их особенности:
Ну вот вы и узнали как представлять текст в формате HTML, но ведь HTML создавался для того, чтобы можно было переходить с одной страницы, на другую, и для этого существует особый элемент называемый гиперссылкой, о них вы и узнаете, если не поленитесь и загрузите
Третью часть