HTML - справочник для начинающих

Твори! Спасение утопающих - дело рук самих утопающих

  1. HTML index
  2. С чего начать?
  3. Синтаксис HTML - операторов
  4. Структура HTML - программы и фреймы
  5. Теги разбивки текста
  6. Теги логического форматирования текста
  7. Теги физического форматирования текста
  8. Описание шрифтов
  9. Вставка изображения в документ
  10. Ссылки в HTML - программах
  11. HTML - списки
  12. HTML - таблицы
  13. Задание бегущей строки
  14. Выгрузка WEB - страниц на сервер

list.ru - каталог ресурсов интернет toplist

  1. HTML index

!-- , a , address , b , base , basefont , big , blockquote , body , br , caption , center , cite , code , dd , dfn , dir , dl , dt , em , font , frame , frameset , h1 , h2 , h3 , h4 , h5 , h6 , head , hr , html , i , img , isindex , kbd , lh , li , link , marquee , menu , meta , nobr , noframes , ol , p , pre , samp , script , small , strike , strong , style , sub , sup , table , td , th , title , tr , tt , u , ul , var

 

  1. C чего начать?

HTML - это очень просто, если знаешь с чего начать. Броузер - программа просмотра файлов в Интернет, должна знать, как интерпретировать полученную информацию. HTML - язык для создания электронных документов - гипертекстов. Спецификой HTML является то, что для уплотнения информации все пробелы заменяются на один - получается сплошной текст, и нужно давать указания специальными словами - тегами, как разместить информацию на экране. Причем, часто теги дают указания общего порядка - логические, как то: это - заголовок, это - важный кусок текста и т.д., но разные программы просмотра, включая текстовые редакторы, могут по разному интерпретировать теги HTML. И задача автора электронного документа донести до любого броузера принимающего компьютера документ, как минимум, в читабельном виде, а в идеале - реализовать задуманный вид. Данный материал базируется на версии HTML 3.2, реализованной броузером Internet Explorer 4.

Прежде всего нужно подготовить с помощью текстового редактора тот, небольшой для первого случая, документ, который вы хотите представить на странице Интернет, и поменять формат файла на один из форматов HTML. Затем загрузите его в редактор для HTML - FrontPage Express, который входит в стандартную поставку Windows 98. На экране материал предстанет в искаженном виде, в том виде, как он будет воспринят броузером Internet Explorer 4, но это уже будет реальный электронный документ. Далее откройте меню Вид, раздел HTML... и в дополнительном окне "Просмотр и правка HTML" увидите HTML - программу, составленную редактором по вашему текстовому документу. Это уже будет законченная программа HTML, в которую входят все основные составляющие любой HTML - программы. Сначала, пользуясь предлагаемым справочником, разберитесь в структуре программы, в значении служебных слов.

Если включен флажок "Показать цветовую кодировку", редактор выделяет в программе служебные слова цветом.
Операторы языка - теги - цветом: html.
Параметры, уточняющие данный оператор - атрибуты - цветом: name="".
Значения, адреса в атрибутах выделяются цветом: #FFFFFF.

Затем, вернитесь в основное окно редактора и попытайтесь улучшить наглядность вашего документа, вставляя элементы, предусмотренные в редакторе. Но не забывайте, при этом, смотреть, как изменяется HTML - программа, и на ней учитесь писать HTML - программы. Действия редактора, как многие отмечают, далеко не всегда могут реализовать замысел, и тогда целесообразно непосредственно вручную редактировать HTML - программу в окне "Просмотр и правка HTML", оценивая качество WEB - страницы в основном окне.

Редактор FrontPage Express допускает работу с файлами размером до 48 КБ. Целесообразно материал разбить на WEB - страницы в пределах 30 КБ, чтобы был запас для непредвиденных расширений материала, а также это обеспечивает оперативную скорость загрузки WEB - страниц.

Чтобы увидеть, как будет выглядеть, разработанная  WEB – страница, в Интернете, достаточно непосредственно в папке двойным щелчком открыть файл, ее содержащий, так как, обычно по умолчанию принято, что файлы с расширениями HTML – документов открываются в Internet Explorer.

Полное представление о языке HTML дает книга М. Браун, Д. Ханикатт "HTML 3.2 в подлиннике" на 1040-а страницах. Но в книге, на мой взгляд, очень много переливания из пустого в порожнее и не удачно расположен материал, если книгой пользоваться, как справочником.

Желаю успеха. При работе над HTML - программой я справочник держу в дополнительном окне и служебные слова копирую в программу прямо из справочника. Панели экрана справочника можно перемещать двунаправленной стрелкой мыши по вашему усмотрению.

А Вам прежде всего нужно продумать эстетику страницы...

 

  1. Синтаксис HTML - операторов
<html>т</html>
контейнерная конструкция тега. т - подразумевает текстовую информацию, на которую распространяется действие тега. Текст, в свою очередь, может содержать теги.
<br>
конструкция тега, при которой действие тега распространяется на текст от этого тега до любого ближайшего тега.
<hr a >
a - предполагает возможность задания для тега уточняющих параметров - атрибутов:
align=""
в апострофах без пробелов проставляется требуемое значение. Между названием тега и атрибутом должен быть пробел.
URL-адрес
адрес единой системы адресации Интернет (URL). Язык HTML использует URL представление адресов.
Пиксел
точка на экране. Все размеры в атрибутах HTML - языка задаются в числе пикселов, если не оговорено дополнительно.

Значение цвета в атрибутах HTML - языка задается именем цвета или кодом RGB стандартных цветов и их производных.

Таблица 16-и стандартных цветов
Название Код RGB Имя Цвет Название Код RGB Имя Цвет
черный #000000 black   серебряный #C0C0C0 silver  
темно-бордовый #800000 maroon   красный #FF0000 red  
зеленый #008000 green   известь #00FF00 lime  
оливковый #808000 olive   желтый #FFFF00 yellow  
темно-синий #000080 navy   синий #0000FF blue  
фиолетовый #800080 purple   фуксия #FF00FF fuchsia  
чирок #008080 teal   аква #00FFFF aqva  
серый #808080 gray   белый #FFFFFF white  

Для любознательных: шесть цифр кода RGB - это три шестнадцатеричных числа в диапазоне 00 - FF. 1-ое, 2-ое и 3-е число, соответственно, представляют собой количество красного, зеленого и синего тонов в цвете. Например, #000000 - это черный цвет (отсутствие цвета), #FF0000 - ярко-красный, #00FF00 - ярко-зеленый, #0000FF - ярко-синий, а #FFFFFF - белый (все цвета присутствуют полностью). Эта цветовая модель является ключевым понятием в редакторах изображений типа Photoshop.

Index

  1. Структура HTML - программы и фреймы

<html>т</html>
границы HTML - программы.

<head>т</head>
заголовок HTML - программы. Необязательный элемент программы.
Теги заголовка HTML - программы:
<title>т</title>
название WEB - страницы не более 64 символов. Обязательный элемент заголовка. Обычно показывается в заголовке окна броузера.
<style a </style>
описание стиля в заголовке. Атрибут:
type="" - определяет тип стиля. Значения:
text/css - текст/css.
<script a </script>
описание скрипта в заголовке. Атрибут:
language="" - определяет тип скрипта. Значения:
JavaScript - Ява-скрипт.
<meta a >
описание одного свойства данной программы - информация для броузера, отображающего WEB - страницу. Атрибуты:
http-equtv="" - определяет тип свойства,
value="" - определяет свойство. Значения:
document - документ;
content=";" - задает значения свойства,
url="" - задает URL - адрес программы для свойства,
name="" - дополнительное описание свойства. Если его нет, то совпадает с http-equtv. Возможные значения:
author - автор программы,
author-corporate - фирма-разработчик программы,
keywords - ключ для поиска,
description - описание программы.
Примеры часто используемых вариантов значений:
http-equtv="Content-Type" content="text/html; charset=iso-8859-1" - программа содержит текст и коды HTML в кодировке iso-8859-1.
http-equtv="Content-Ianguage" content="en" - программа на английском языку.
http-equtv="refresh" content="60" url = "... " - страницу с указанным адресом загрузить через 60 секунд.
http-equtv="refresh" content="60" - текущую страницу перезагружать через каждые 60 секунд.
name="Keywords" content="список ключевых слов" - список для поиска по ключу данного документа поисковыми системами.
name="Description" content="краткое описание" - аннотация - список для индексации документа поисковыми системами, примерно, 200 - 300 символов. Обычно в "поисковиках" выводится под названием документа или всплывает, если задержать курсор мыши на названии.
<isindex a >
предупреждает броузер о наличии индексного поиска в HTML - программе. Атрибуты:
prompt="" - задает надпись у поисковой строки,
action=""
указывает поисковую программу, которой передается введенная строка текста.
<base a >
указывает полный базовый адрес, где хранится данная HTML - программа. Атрибуты:
href="" - URL - адрес. Обязательный атрибут.
target="" - имя кадра.
<link a >
описывает связь данной программы с другой программой. Броузер предварительно проверяет существование файла, с которым в программе возможна связь. Атрибуты:
href="" - URL - адрес другой программы,
rel="" - тип другой программы или тип связи. Значения:
bookmark - закладка,
copyright - авторские права,
glossary - глоссарий,
help - программа-справка,
home - домашняя страница,
index - поисковая программа,
toc
next - переход к следующему документу,
previous - возврат к предыдущему документу;
rev="" определяет отношение данной программы к другой. Значения:
made - откроет окно ( для почты e-mail),
author - (автор),
editor - (редактор),
publisher - (издатель),
owner - (владелец);
type="" указывает тип и параметры присоединенной таблицы стилей. Значения:
text/css - текст/скрипт.
<body a >т</body>
текст (тело) WEB - документа. Атрибуты:
bgcolor="" - цвет фона документа,
background="" - URL - адрес файла ( .gif) фонового рисунка. Окно полностью заполняется изображением, как кафельной плиткой, начиная с верхнего левого угла;
text="" - цвет текста,
alink="" - цвет активной ссылки,
link="" - цвет не просмотренной ссылки,
vlink="" - цвет просмотренной ссылки,
topmargin="" - граница верхнего поля,
leftmargin="" - граница левого поля,
bgproperties=fixed - фоновое изображение не прокручивается вместе с текстом,
onload=""
<address>т</address>
сведения об авторе страницы, дата создания и обновления. Текст обычно выделяется курсивом.

<frameset a >т</frameset>
контейнер кадров (фреймов): тело WEB - документа в виде кадров. HTML - программа, имеющая структуру кадров, не должна содержать контейнеры <body> и наоборот. Если в программе есть контейнеры обоих видов, то броузер будет отображать только контейнеры <body>. Атрибуты описывают сетку кадров:
rows="," - список значений высоты строк сверху вниз,
cols="," - список значений ширины столбцов слева направо.
Значения могут быть выражены и в пикселах, и в % от размера окна, а также делить пространство в ( * ) долях между собой. Например:
cols="100 , 25% , * , 3* , 2* ". Здесь 1-ый кадр будет шириной в 100 пикселов, 2-ой - шириной в 25% от ширины окна. Оставшееся пространство делится между 3-я кадрами в пропорциях 1/6, 3/6, 2/6. Число заданных кадров равно произведению строк и столбцов. В данном примере - 5 кадров;
frameborder=""
задает тип рамок между кадрами контейнера. Значения:
no - рамки не видимы - имеют цвет фона окна броузера,
yes - рамки имеют цвет;
bordercolor=""
задает цвет рамок между кадрами. По умолчанию - совпадает с цветом рамки окна;
border=""
устанавливает ширину рамок между кадрами контейнера. Если значение отсутствует, то кадры отделяются друг от друга тонкими линиями заданного цвета;
framespacing=""
расстояние между кадрами. Этот атрибут реализован только в броузере Internet Explorer 4.
 
Теги контейнера кадров
 
Внутри контейнера кадров могут быть вложенные контейнеры кадров, теги кадров и контейнер, заменяющий структуру кадров для броузеров, не поддерживающих механизм фреймов. Вложенный контейнер заменяет один кадр.
<frame a >
описывает отдельный кадр. Число таких тегов должно быть равно числу зарезервированных кадров в контейнере (за минусом вложенных контейнеров). Располагаются кадры последовательно слева направо и сверху вниз. Атрибуты:
src=""
URL - адрес содержимого кадра. Обычно это файл HTML - программы из того же каталога (папки), что и сам контейнер, но может быть и абсолютный адрес файла с любого компьютера. Если этот атрибут не задан, кадр будет пустым;
marginwidth=""
marginheight=""
ширина от границы кадра до рамки по вертикали и горизонтали, соответственно;
scrolling=""
определяет полосы прокрутки. По умолчанию полосы прокрутки добавляются в кадр, если содержимое кадра больше его размеров. Значения:
yes - полосы прокрутки будут обязательно,
no - полосы прокрутки запрещены,
auto - полосы прокрутки добавляются по умолчанию;
noresize
запрещает пользователям менять размеры кадра. По умолчанию, если захватить рамку кадра мышью, появляется двунаправленная стрелка, которой можно переместить рамку;
frameborder=""
задает тип рамки кадра. Значения:
yes - рамка имеет 3-х мерную форму,
no - рамка плоская;
bordercolor=""
задает цвет рамки кадра;
name=""
имя кадра, которым метят кадр. Имя показывает, в какой кадр делать загрузку при ссылке.
<noframes>т</noframes>
контейнер HTML - текста для броузеров, которые не поддерживают аппарат кадров. Броузеры, поддерживающие кадры, игнорируют этот контейнер.

<!--т-- >
комментарий в программе для отладки программы, который не будет виден читателю.
& . . .
обозначает имя специального символа, который не вошел в базовую таблицу кодов ASCII. В отличие от остальных конструкций HTML, имена специальных символов учитывают регистр клавиатуры. Нельзя, например, использовать &LT; вместо &lt;.
&nbsp;
обозначает пустое место.
 
Не все теги есть во всех броузерах. Броузер пропускает теги, которые в нем не реализованы, и просто печатает текст размещенный в их контейнере.

Index

  1. Теги разбивки текста

<h1 a >т</h1>
<h2 a >т</h2>
<h3 a >т</h3>
<h4 a >т</h4>
<h5 a >т</h5>
<h6 a >т</h6>
заголовки стилей 1, 2, 3, 4, 5, 6. В стиле 1 - самый крупный шрифт броузера, а в стиле 6 - самый мелкий шрифт. Атрибуты:
align="" - задает положение заголовка на строке. Значения:
left - выровнять заголовок по левому краю,
center - выровнять заголовок по центру,
right - выровнять заголовок по правому краю.

<p a >т</p>
выделение абзаца. Между абзацами броузер даст пустую строку. Атрибут:
align="" - задает положение текста абзаца на строке. Значения:
left - выровнять текст по левому краю,
center - выровнять текст по центру,
right - выровнять текст по правому краю.

Тега контейнера абзаца:
<br>
продолжение текста в контейнере с новой строки без пропуска строки. Два оператора подряд дают пропуск строки.

<nobr>т</nobr>
текст в контейнере не разбивать на строки.

<hr a >
задает горизонтальную линию. Атрибуты:
width="" - длина линии или в пикселах или в % от ширины окна,
size="" - ширина линии,
color="" - цвет линии,
noshade - отменяет рельефность линии,
align="" - положение линии на строке экрана. Значения:
left - прижать линию к левому краю,
center - расположить линию по центру,
right - прижать линию к правому краю.

<pre a >т</pre>
контейнер для текста заранее отформатированного в текстовом редакторе (преформатированного). Применяется только шрифт фиксированной ширины. Так, как преформатированный текст жестко привязан к пикселам, могут возникать сложности вывода на экран в другом компьютере. Допускаются теги <p>, <br>, все теги логического и физического форматирования, элементы ссылок. Нельзя применять теги <h1>, ... <h6>, <address>. Атрибут:
width="" - максимальное число символов в строке.

Index

  1. Теги логического форматирования текста

Операторы логического форматирования указывают тип текста, а как будет отображен данный текст, решает броузер читателя.

<code>т</code>
машинописный текст. Обычно отображается шрифтом фиксированной ширины.

<kbd>т</kbd>
смоделировать текст, введенный с клавиатуры. Обычно отображается шрифтом фиксированной ширины.

<samp>т</samp>
смоделировать текст, выведенный на печать. Обычно отображается шрифтом фиксированной ширины.

<strong>т</strong>
важный фрагмент. Обычно броузер выделяет его полужирным шрифтом.

<em>т</em>
текст. Обычно выделяется шрифтом со сдвигом или курсивом.

<dfn>т</dfn>
определение. Обычно выделяется курсивом.

<var>т</var>
выделить переменные. Обычно отображается шрифтом фиксированной ширины.

<cite>т</cite>
цитата. Обычно выделяется курсивом.

<blockquote>т</blockquote>
контейнер для цитаты. Обычно цитата сдвигается вправо. Этот контейнер удобно использовать для создания полей в документе. Допускаются теги форматирования текста.

Index

  1. Теги физического форматирования текста

Операторы физического форматирования непосредственно указывают броузеру читателя, в каком виде отображать текст из данного контейнера. Контейнеры физического форматирования могут быть вложены друг в друга.

<b>т</b>
выделить текст полужирным шрифтом.

<i>т</i>
выделить текст курсивом.

<tt>т</tt>
выделить текст шрифтом фиксированной ширины.

<u>т</u>
текст подчеркнуть.

<strike>т</strike>
перечеркнуть текст горизонтальной линией.

<big>т</big>
вывести текст шрифтом большего размера.

<small>т</small>
вывести текст шрифтом меньшего размера.

<sub>т</sub>
вывести текст , если возможно, шрифтом меньшего размера и сдвинуть ниже уровня строки.

<sup>т</sup>
вывести текст , если возможно, шрифтом меньшего размера и сдвинуть выше уровня строки.

<center>т</center>
вывести текст по центру.

Index

  1. Описание шрифтов

<font a >т</font>
описывает шрифт текста, помещенного в контейнер. Контейнер описания шрифта может быть помещен в любой другой контейнер. Атрибуты:
face="","" ...
задает имя шрифта или несколько возможных шрифтов. Броузер берет последующий шрифт, если у него нет предыдущего;
size=""
задает размер шрифта: 1, 2, 3, 4, 5, 6, 7. Базовый размер шрифта - 3. Шрифты могут быть заданы относительно базового +1, -1, +2, -2, и т.д.;
color="" - задает цвет шрифта;
style="" - описание стиля.

<basefont a >
описывает стандартный шрифт для данного WEB - документа. Действует до следующего тега этого типа. Атрибуты:
face="","" ...
задает имя шрифта или несколько возможных шрифтов. Броузер берет последующий шрифт, если у него нет предыдущего;
size=""
задает размер шрифта: 1, 2, 3, 4, 5, 6, 7. Базовый размер шрифта - 3. Шрифты могут быть заданы относительно базового +1, -1, +2, -2, и т.д.;
color="" задает цвет шрифта.

Index

  1. Вставка изображения в документ

<img a >
вставляет изображение на WEB-страницу. Атрибуты:
src=""
URL-адрес файла-изображения с расширением .gif, .jpeg (.jpg), .xbm, или .png (два последних формата использовать не желательно);
alt=""
текст. Описание изображения выводится на место изображения до ввода изображения, а также появляется, как всплывающая подсказка, если задержать курсор мыши на изображении. Наличие этого атрибута помогает броузеру быстрее загружать страницу;
height=""
width=""
задают высоту и ширину изображения, соответственно. (Размер изображения можно получить из редактора изображений, например, Adobe PhotoShop. Некоторые броузеры тоже показывают размер файла изображения в строке названия, если просматривать изображение само по себе, без текста).
Если загружаемое изображение больше указанных размеров, то оно уменьшается "втискиванием", а если меньше - растягивается. Можно не задавать размеры изображения, но наличие этого атрибута помогает броузеру быстрее загружать страницу;
border=""
задает ширину рамки вокруг изображения;
vspace=""
hspace=""
задают расстояние по вертикали и по горизонтали от изображения до кромки текста, соответственно;
align=""
задает положение текста относительно изображения. Значения:
top - выровнять по верху строку, следующую за изображением,
middle - выровнять по середине строку, следующую за изображением,
bottom - выровнять по низу строку, следующую за изображением,
left - текст должен обтекать изображение, прижатое к левой стороне окна,
right - текст должен обтекать изображение, прижатое к правой стороне окна.

Некоторые WEB-мастеры, чтобы составить из нескольких рисунков один, используют таблицы без рамок.

Если тег <img src > указывает на изображение, которого не существует, броузер заменяет его фиктивным изображением. Проверьте, существует ли на самом деле изображение, на которое выполняется ссылка, правильно ли задан URL-адрес гиперссылки и установлен ли для файла нужный тип доступа - чтение для всех.

За дополнительной информацией по работе с изображениями советую обратиться к Александру Клеткину, фирма "Трилоджик Груп". Изображения. Адрес в Интернете: http://www.tlc.kherson.ua/users/pictures.html

Index

  1. Ссылки в HTML - программах

Гипертекстовым документом называется документ, содержащий ссылки на другие документы, позволяющие при помощи нажатия кнопки мыши быстро переходить от одного документа к другому не задумываясь, где находится этот документ.

<a a >т</a>
контейнер для описания указателя ссылки, как-то: подчеркнутый текст, маркер - точка, звездочка; пиктограммы - экранные кнопки, рекламные вставки и т.д. На указателе нужно щелкнуть мышью, чтобы сделать переход по ссылке. Атрибуты:
title=""
задает текст, всплывающий, если задержать курсор мыши на указателе,
style="" - описание стиля.
<a a name="" >т</a>
метка (закладка) внутри текущей HTML - программы. Этим оператором метят место, куда предполагается делать переходы. Текст контейнера в этом случае выводится на WEB - странице в место закладки. Обязательный атрибут:
name="" - задает имя метки из символов латинского алфавита.
<a a href="" >т</a>
ссылка. Атрибуты:
href=""
задает URL - адрес. Адрес может быть относительный:
. . . # . . . - имя файла в пределах данного компьютера плюс имя метки в пределах данного файла;
или абсолютный адрес, задающий компьютер, каталог, файл. Абсолютный адрес может давать переход на любой компьютер сети Интернет:
http: // www. ( . . . ) . ( . . . )/ - на WEB - страницу,
mailto: ( . . . ) @ ( . . . ) - на электронную почту - E-mail ,
news: ( . . . ) . ( . . . ) - на Newsgroup - группу новостей системы телеконференций UseNet,
ftp: // ftp. ( . . . ) . ( . . . ) - на FTP - сайты системы хранения и передачи файлов, где хранятся новые программные продукты, гостевые файлы (FAQ) и т.д.,
goppher: // goppher. ( . . . ) . ( . . . )/ - на сайты системы Gopher,
wais: // wais. ( . . . ) . ( . . . )/ - на WAIS - систему больших (распределенных) баз данных,
telnet: // bbs.( . . . ) . ( . . . )/ - на Telnet - систему удаленных компьютеров;
file: //( ... ):\( . . . ) . ( . . . ) - файл с диска данного компьютера;
. . . ? . . . - URL - адрес плюс строка поиска - ссылка на поиск строки.
target=""
задает имя кадра (фрейма), в который делается загрузка по ссылке - заменяется содержимое кадра. Можно указывать имя целого экрана. Если этого атрибута нет, то файл будет выведен в том же окне, где указана ссылка. Зарезервированные (служебные) имена кадров:
_blank - загрузить файл в новое окно без названия;
_self - загрузить файл в кадр, откуда делается вызов. Перед новой загрузкой выполняется очистка;
_parent - загрузить файл в старший (родительский) кадр. Заменяет всю сетку кадра. Если старшего кадра нет, то в кадр вызова;
_top - загрузить файл в полное окно. Разрушает всю структуру кадров.
new - загрузить файл в новое окно.
По желанию Народа привожу поясняющий пример: как сделать, чтобы по ссылке из файла, загруженного в кадр, открывался файл в другом кадре.
Чтобы по ссылке в "левом" кадре открылся файл в "правом" кадре, конструкция ссылки в файле, загруженном в "левый" кадр должна быть такой:
<a href="имя файла#имя метки" target="правый" >указатель ссылки</a>,
где: "имя файла" - имя файла, загружаемого в "правый" кадр,
"имя метки" - имя метки в этом файле.

Ссылки могут передаваться на файлы разных форматов:

простой текст .txt файл PostScript .ps
документ HTML .html или .htm звуковой файл AIFF .aiff
рисунок GIF .gif звуковой файл AU .au
рисунок TIFF .tiff звуковой файл WAV .wav
рисунок X Bitmap .xbm анимация QuickTime .mov
рисунок JPEG .jpg (.jpeg) фильм MPEG .mpeg (.mpg)

Index

  1. HTML-списки

Допускается вложение контейнеров списков всех типов друг в друга и пустые списки. Броузеры делают отступы вложенного списка относительно внешнего. В начале и в конце списка делается перевод строки.

Теги общие для всех типов списков (кроме определений):
<lh> - заголовок списка,
<li> - начало пункта списка.
Атрибут общий для всех типов списков:
compact - представить список в компактном виде (например, меньшим шрифтом).

<ol a >т</ol>
нумерованный список. Атрибуты:
start=""
устанавливает начальный номер в текущем списке,
type=""
устанавливает тип маркера. Значения:
A - маркер в виде прописных букв,
a - маркер в виде строчных букв,
I - маркер в виде больших римских цифр,
i - маркер в виде маленьких римских цифр,
1 - маркер в виде арабских цифр.

<ul a >т</ul>
маркированный список. Атрибут:
type=""
устанавливает тип маркера. Вид маркеров в каждом броузере свой для разных значений:
disc, square, circle.

<menu a >т</menu>
маркированный список.

<dir a >т</dir>
маркированный список.

<dl a >т</dl>
список определений. Теги пункта определения:
<dt> - определяемый термин не более строки,
<dd> - обзац определения термина.
Оба тега определения могут также использоваться отдельно для создания ненумерованных и немаркированных списков.

Index

  1. HTML - таблицы

Таблицы могут быть вложены друг в друга.

<table a >т</table>
контейнер "Таблица". Атрибуты контейнера "Таблица":
width=""
height=""
ширина и высота таблицы в пикселах или в % от ширины и высоты окна, соответственно;
border=""
ширина рамки. Если значение - ноль, то рамка не требуется;
cellpadding=""
cellspacing=""
добавляют свободное пространство между данными ячейки и ее границами, и между ячейками таблицы, соответственно. Если рамка отсутствует, то отступ от границы будет равен сумме этих значений;
align=""
задает положение данных в ячейках таблицы по горизонтали. Значения:
left - данные прижать к левому краю ячеек,
center - данные расположить по центру ячеек,
right - данные прижать к правому краю ячеек.
Теги контейнера "Таблица":
<caption a >
заголовок таблицы. Атрибут:
align=""
задает место заголовка. Значения:
top - заголовок над таблицей,
bottom - заголовок под таблицей.
<tr a >т</tr>
контейнер строки таблицы. Если контейнер пуст - строка пустая. Заданные атрибуты строки подавляют атрибуты таблицы. Атрибуты строки:
bgcolor=""
задает цвет фона ячеек строки;
bordercolor=""
задает цвет рамки к ячейкам строки;
valign=""
задает положение данных в ячейке по вертикали. Значения:
baseline - данные располагать в ячейках по базовой линии строки,
bottom - данные прижимать к нижнему краю ячеек строки,
middle - данные располагать по центру ячеек в строке,
top - данные прижимать к верхнему краю ячеек строки.
<th a >т</th>
контейнер ячейки "Заголовок": заголовок столбца или строки. По умолчанию текст в этой ячейке показывается жирным шрифтом по центру. Атрибуты:
align=""
задает положение данных в ячейке "Заголовок" по горизонтали. Значения:
left - заголовок прижать к левому краю ячейки,
center - заголовок расположить по центру ячейки,
right - заголовок прижать к правому краю ячейки;
valign=""
задает положение данных в ячейке "Заголовок" по вертикали. Значения:
bottom - заголовок прижать к нижнему краю ячейки,
middle - заголовок расположить по центру ячейки,
top - заголовок прижать к верхнему краю ячейки;
colspan=""
задает число ячеек, объединяемых в одну на строке;
rowspan=""
задает число ячеек, объединяемых в одну в столбце.
<td a >т</td>
контейнер ячейки таблицы. Если контейнер пуст или содержит значение &nbsp;- ячейка пустая. Заданные атрибуты ячейки подавляют атрибуты строки и таблицы. Атрибуты ячейки:
width=""
height=""
ширина и высота ячейки в пикселах или в % от ширины и высоты окна, соответственно;
align=""
задает положение данных в ячейке по горизонтали. Значения:
left - данные прижать к левому краю ячейки,
center - данные располагать по центру ячейки,
right- данные прижать к правому краю ячейки;
valign=""
задает положение данных в ячейке по вертикали. Значения:
baseline - данные расположить в ячейке по базовой линии,
bottom - данные прижать к нижнему краю ячейки,
middle - данные расположить по центру ячейки,
top - данные прижать к верхнему краю ячейки;
bgcolor=""
задает цвет фона ячейки;
bordercolor=""
задает цвет рамки к ячейке;
colspan=""
задает число ячеек, объединяемых в одну на строке;
rowspan=""
задает число ячеек, объединяемых в одну в столбце;
nowrap
отмена переноса слов на другую строку внутри ячейки.

За дополнительной информацией по работе с таблицами советую обратиться к Александру Клеткину, фирма "Трилоджик Груп" Таблички. Адрес в Интернете: http://www.tlc.kherson.ua/users/tables.html

Index

  1. Задание бегущей строки

<marquee a >т</marquee>
контейнер изображения для анимации. Атрибуты:
width=""
height=""
ширина и высота бегущей строки в пикселах или в % от ширины и высоты окна, соответственно;
align=""
задает положение изображения относительно бегущей строки по вертикали. Значения:
top - изображение выровнять по верхнему краю строки,
middle - изображение расположить по середине строки,
bottom - изображение выровнять по нижнему краю строки;
bgcolor="" - цвет бегущей строки;
behavior="" - задает тип движения. Значения:
scroll - прокрутить,
slide - слайды,
alternate - поочередно менять направление (качание);
direction=""
задает направление движения. Значения:
left - изображение движется влево по строке,
right - изображение движется вправо по строке;
scrollamount=""
scrolldelay=""
задают скорость перемещения: число пикселов, на которое должно переместиться изображение за заданное число миллисекунд, соответственно;
loop=""
задает число повторов анимации. По умолчанию повторять непрерывно.

Index

  1. Выгрузка WEB - страниц на сервер

Во-первых, в ходе написания WEB - документа не забудьте через теги <meta ... > дать список ключевых слов и аннотацию вашего документа - это очень помогает поисковым системам в определении соответствия запросу.

В завершении разработки из WEB - страниц нужно организовать структуру соответствующую требованиям сайта. Обычно, сайт имееть иерархическую структуру. В корневом каталоге размещается запускающая программа, как то: головная страница, и подкаталоги. Запускающая программа должна иметь имя index. *. Причем, хочу отметить, что при расширении .html файл имеет кодировку win, а с расширением .htm - кодировку koi. Подкаталоги содержат файлы-страницы, к которым запускающая программа обращается через относительные адреса вида: podkatalog\name.*. Размер каждой страницы не должен превышать 80000 байт.

Сопровождение WEB - страниц на сервере провайдера включает создание сайта, размещение WEB - страниц и обслуживание сайта. При обслуживании сайта добавляют, удаляют файлы, каталоги, встраивают скрипты и т. д. Сложность этой задачи в прямую зависит от условий, на которых провайдер предоставляет доступ к машине: есть ли доступ к командной оболочке, или нужно работать через FTP - программу, или владельцы сервера сами формируют личные сайты и предоставляют свой упрощенный программный аппарат по обслуживанию сайтов. Для новичков, как мне видится, лучше предпочесть последний путь. К таким организаторам, которые предоставляют мастерскую “Управление файлами”, относится сервер www.narod.ru.

После того, как WEB - страницы выгружены на сервер, их хорошо бы протестировать в Интернете, например, программой Doctor HTML по адресу: http://www2.imagiware.com/RxHTML/ . В режиме "Singie Page Analysis" программа проводит орфографический контроль HTML, оценивает длительность загрузки изображений, проверяет работоспособность гиперссылок и многое другое.

После размещения HTML - файлов и, когда вы воочию убедитесь, что ваш сайт создан, можно объявить о нем через какую-либо поисковую систему, например, здесь: weblist.ru.

Резюме

При подготовке этого материала я не стремилась к разжевыванию HTML - операторов, это уже сделали многие другие, а старалась компактно, в виде формального описания, собрать максимум информации по языку HTML. Глубже понять действие операторов при создании HTML - программ мне помогает стратегия проб и ошибок. Компьютер в большинстве случаев сам подсказывает, как надо действовать.

Заранее приношу извинения за возможные неудобства и неточности. Буду рада выслушать Ваши пожелания и комментарии:
Книга для гостей
Если Народ проявит интерес, то будет продолжение по расширенным возможностям HTML.

© Материал составила Татьяна Треумова, ttb@nm.ru



Сайт создан в системе uCoz