Основы работы с HTML

Атрибуты тегов

Теги могут иметь атрибуты, которые предоставляют дополнительную информацию об элементах HTML. Атрибуты всегда используются в виде пары "имя/значение". Общий формат задания атрибутов имеет вид:
<имя_тега имя_атрибута="значение">
Например, тег:

означает, что цвет фона страницы должен быть красным.
А тег:

означает, что параграф необходимо выровнять по центру страницы отображения браузера.
Атрибуты всегда помещаются в начальном теге элемента HTML. Значения атрибутов всегда должны заключаться в кавычки. Наиболее широко используются двойные кавычки, но одиночные кавычки также допустимы.
В некоторых редких ситуациях, когда, например, значение атрибута само содержит кавычки, необходимо использовать одиночные кавычки:
ИНТУИТ
Пример выполнения данного HTML-кода
Кроме атрибутов записываемых вышеописанным способом, для некоторых элементов определены специальные флаги, которые просто указываются как <тег имя_флага>.
Попробуйте исправить текст в этих полях ввода

Пример выполнения данного HTML-кода

Дополнительные параграфы

Этот пример демонстрирует некоторые особенности поведения по умолчанию элементов параграфа.

Этот параграф содержит много строк в исходном коде, но браузер это игнорирует.

Этот параграф содержит много пробелов в исходном коде, но браузер это игнорирует.

Пример выполнения данного HTML-кода

Дополнительные примеры

Лучшим способом изучения HTML является работа с примерами. Рассмотрим несколько примеров, которые иллюстрируют некоторые элементы форматирования документов.

Фоновый цвет

Этот пример демонстрирует использование цветного фона на странице HTML. При выборе фона всегда проверяйте, чтобы текст был хорошо читаем!

Смотри: Цветной фон!

Пример выполнения данного HTML-кода

Горизонтальная линейка

Разделять различные элементы можно при помощи горизонтальной линейки, для этого используйте тег

:
Это параграф отобразится сверху горизонтальной полосы.

Это параграф отобразится снизу горизонтальной полосы.

Пример выполнения данного HTML-кода
Тег

не имеет закрывающего тега. Поэтому для совместимости с будущими версиями стандарта рекомендуется следующее написание тега

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

Элементы HTML

Страницы Всемирной паутины отображаются при помощи документов HTML, которые являются обычными текстовыми файлами, содержащими специальные теги разметки. Теги разметки определяют элементы HTML, из которых состоят документы HTML.

Это заголовок 1, Он выровнен по центру страницы.

Используйте теги заголовков только для заголовков. Не используйте их просто для того, чтобы выделить что-то жирным шрифтом. Используйте для этого другие теги.

Комментарии в HTML

Тег комментария используется для вставки комментариев в исходный код HTML. Комментарии будут проигнорированы браузером. Комментарии можно использовать для пояснения кода, что может помочь при редактировании исходного кода в будущем.

Вот пример:
Этот текст будет показан в окне браузера.
Пример выполнения данного HTML-кода

Этот пример демонстрирует, как использовать

Этот пример демонстрирует, как использовать комментарий в исходном коде HTML.

Это обычный параграф.

Пример выполнения данного HTML-кода

Коротко о HTML

HTML (Hyper Text Markup Language) означает язык разметки гипертекста. Этот язык был разработан Тимом Бернерсом-Ли в рамках создания проекта распределенной гипертекстовой системы, которую он назвал World Wide Web (WWW) или Всемирная паутина. HTML предназначен для написания гипертекстовых документов, публикуемых в World Wide Web. Документ на языке HTML может включать следующие компоненты:

стилизованный и форматированный текст,

команды включения графических и звуковых файлов,

гиперсвязи с различными ресурсами Internet.

скрипты на языке JavaScript и VBScript.

различные объекты, например Flash-анимацию

Документы HTML являются обычными текстовыми файлами, содержащими специальные теги (или управляющие элементы) разметки. Теги разметки указывают браузеру Web (программе пользователя для отображения web-страниц, например, Internet Explorer, Mozilla, Netscape или Opera), как надо вывести страницу.
Файлы HTML обычно имеют расширения htm или html. Их можно создавать при помощи любого текстового редактора.
Язык HTML является подмножеством мощного языка SGML (Standard Generalized Markup Language), который широко используется в издательской деятельности. Основной выигрыш от использования этих языков состоит в переносимости текста между разными издательскими системами. Эта же особенность сохраняется и в HTML. Так, читая документ, пользователи могут устанавливать способы выделения текста, гарнитуру и размер шрифтов по своему вкусу; они могут отменить просмотр рисунков.
В документе HTML можно выделить два основных блока: головная часть и тело документа. Содержимое головной части не выводится на экран пользователя, за исключением заголовка, в ней, как правило, указывают ключевые слова, авторов и другую служебную информацию, а также подключают внешние таблицы стилей и скрипты. В теле документа размещают ту информацию которая будет выведена пользователю.

Коротко о тегах

Теги HTML используются для выделения элементов HTML. Обычно теги HTML используются парами и заключены между двумя символами угловых скобок < (начальный тег)> и <(конечный тег)>. Текст между начальным и конечным тегами является содержимым элемента. Некоторые теги не имеют конечного, например, тег принудительного переноса строки
, для таких тегов рекомендуется использовать следующее написание
.
Регистр символов для отображения тегов не важен, например, и означает одно и то же. Однако в этом курсе используется нижний регистр для написания тегов. Это связано с тем, что консорциум WWW (W3C), который занимается стандартизацией спецификации HTML, рекомендует использовать теги в нижнем регистре, поскольку в следующем поколении стандартов будет именно такое требование.

Коротко об элементах HTML

Рассмотрим тот же пример документа HTML:
Это заголовок страницы

Здравствуйте!

Это моя первая страница HTML. Этот текст выводится жирным шрифтом.

Пример выполнения данного HTML-кода
Элементом HTML является:

Здравствуйте!

Этот элемент начинается с тега

, имеет содержимым "Здравствуйте!" и заканчивается тегом

.
Также элементом HTML, является:
Это моя первая страница HTML. Этот текст выводится жирным шрифтом.

Этот элемент, начинается с начального тега , заканчивается конечным тегом
и означает, что содержимое элемента "Это моя первая страница HTML. Этот текст выводится жирным шрифтом." является отдельным параграфом. При этом внутри этого элемента находится другой элемент:
Этот текст выводится жирным шрифтом.
Этот элемент HTML начинается с начального тега: Содержимым элемента HTML является: Этот текст выводится жирным шрифтом. Этот элемент HTML заканчивается конечным тегом . Назначение тега состоит в определении элемента HTML, который должен выводиться жирным шрифтом.
Все описанные элементы HTML содержатся в элементе:

Здравствуйте!
Это моя первая страница HTML. Этот текст выводится жирным шрифтом.

Этот элемент HTML начинается с начального тега , и заканчивается конечным тегом . Назначение тега состоит в определении элемента HTML, который содержит основную часть (или тело) документа HTML.

Мой первый сайт
В разных операционных системах имеются различные редакторы, которые можно использовать для создания документов HTML. Если вы используете:
Microsoft Windows запустите редактор Notepad;
Mac OS запустите редактор SimpleText;
OSX запустите редактор TextEdit (обязательно измените настройки "Rich Text" или "Расширенный текст" на "Plain text" или "Простой текст" и отметьте пункт "Ignore rich text commands in HTML files" или "Игнорировать команды расширенного текстового формата в файлах HTML").

Файлы HTML можно создавать и в редакторе Microsoft Word, в котором имеется возможность сохранить документ как Web-страницу (в меню "Файл"), однако использовать эту возможность не рекомендуется. Во-первых, потому что HTML-код, генерируемый MS Word не оптимален и содержит множество ненужных элементов разметки, и, во-вторых, автоматическая генерация кода не будет способствовать изучению и правильному пониманию HTML.
Имеется также большое количество специализированных редакторов для создания файлов HTML, таких как FrontPage, Macromedia Dreamweaver или Adobe Web Bundle, которые обладают возможностью WYSIWYG (What You See Is What You Get - что видишь, то и получишь). С их помощью можно легко создавать документы HTML, при помощи кнопок и элементов меню, а не писать самому теги разметки. Однако, как уже отмечалось выше, тем, кто хочет стать технически грамотным разработчиком Web, настоятельно рекомендуется использовать простой текстовый редактор для начального изучения HTML.
Напечатайте следующий текст:
Это заголовок страницы
Здравствуйте!
Это моя первая страница HTML. Этот текст выводится жирным шрифтом.

Пример выполнения данного HTML-кода
Сохраните файл как "page1.htm".
При сохранении файла HTML можно использовать расширение .htm или .html. Расширение .htm было принято для старых версий операционных систем, которые допускали трехбуквенное расширение для файлов. В настоящее время практически все операционные системы не имеют подобного ограничения и можно использовать расширение .html.
Теперь посмотрите как браузер отобразит вашу первую страницу. Запустите браузер Интернет. Выберите "Open" или "Open Page" ("Открыть" или "Открыть страницу") в меню File (Файл) браузера. Появится диалоговое окно. Выберите "Browse" или "Choose File" ("Просмотр" или "Выбрать файл") и найдите только что созданный файл HTML - "page1.htm" - выберите его и щелкните на кнопке "Open" ("Открыть"). В диалоговом окне должен появиться адрес, например "C:\MyDocuments\page1.htm". Щелкните на кнопке ОК, и браузер выведет на экран вашу страницу.

Параграфы.
Прежде чем изучать теги форматирования HTML посмотрим как введенный текст отобразится, если не будут применены никакие теги кроме тегов и . Следующий пример демонстрирует такой документ HTML
Этот текст будет показан в окне браузера.
Пример выполнения данного HTML-кода
Этот простой пример документа HTML, который содержит минимальное количество тегов HTML и демонстрирует, как текст внутри элемента body отображается в браузере.
Если ввести большой объем текста таким способом, то читать его будет очень не удобно. Логичнее разбить его на параграфы, как в книге, которые повышают читабельность текста, и кроме того выделяют смысловые блоки.
Следующий пример показывает как отображаются параграфы
Это параграф 1.
Это параграф 2.
Это параграф 3.

Пример выполнения данного HTML-кода
Этот пример демонстрирует, как в браузере выводится текст внутри элементов параграфа. Можно видеть, что по умолчанию текст каждого параграфа выводится в виде отдельного блока. Каждый из таких блоков отделяется от предыдущих и последующих блоков страницы пустой строкой. Однако отображение параграфа браузером может быть легко изменено посредством таблицы стилей.
Можно заметить, что параграфы можно записывать без закрывающего тега
, однако лучше этого не делать, тем более, что в следующей версии HTML не позволит пропустить ни один не закрывающий тег.
В разных браузерах на разных мониторах с разным разрешением страница будет отображаться по-разному, поэтому не стоит форматировать при помощи добавления пустых строк и пробелов. Любое число пробелов заменяется одним.
Использование пустых параграфов для вставки пустых строк является плохим стилем, вместо этого используйте тег
.

Перенос строк
Этот пример демонстрирует использование переноса строк в документе HTML.

Чтобы выполнить перенос
строк
в
параграфе,
используйте тег br.

Пример выполнения данного HTML-кода
Этот пример демонстрирует некоторые проблемы с форматированием HTML. Попробуем сформатировать стихи:

В лесу родилась елочка. В лесу она росла. Зимой и летом стройная, Зеленая была.

Обратите внимание, что браузер просто проигнорировал использованное форматирование!

Пример выполнения данного HTML-кода

Переносы строк.
Для переноса внутри параграфа используется тег
, который выполняет принудительный перенос строки.
Это
пара
граф с переносами строк

Пример выполнения данного HTML-кода
Тег
не имеет закрывающего тега. Поэтому для совместимости с будущими версиями стандарта рекомендуется следующее написание тега

Разбор примера
Ваш первый HTML-документ начинается с тега , который сообщает браузеру о начале документа HTML и заканчивается тегом , который информирует браузер о достижении конца документа HTML.
Текст между тегами и является информацией заголовка документа. Эта информация не выводится в окне браузера.
Текст "Это заголовок страницы" между тегами и является заголовком документа. Этот заголовок выводится в строке заголовка окна браузера.
Текст между тегами и является текстом, который будет выведен в окне браузера. Текст "Здравствуйте!" между тегами
и
будет отображен стилем заголовка, обычно жирным шрифтом большего размера.
Тег означает, что начинается новый параграф, тег
означает конец параграфа.
Текст "Этот текст выводится жирным шрифтом." между тегами и будет выведен жирным шрифтом.

Таблица основных тегов HTML
ТегОписание
Определяет документ HTML
Определяет основную часть или тело документа
--
Определяет заголовки с 1 по 6
Определяет параграф

Вставляет единичный перенос строки
Определяет горизонтальную линейку
Определяет комментарий

Заголовки.
Заголовки определяются с помощью тегов от
до
.
определяет заголовок самого большого размера, а
определяет заголовок самого маленького размера.

Это заголовок первого уровня

Это заголовок второго уровня

Это заголовок третьего уровня

Это заголовок четвертого уровня

Это заголовок пятого уровня

Это заголовок шестого уровня

Заголовки автоматически отделяются дополнительными промежутками от остальных элементов документа.

Здравствуйте!
Это моя первая страница HTML. Этот текст выводится жирным шрифтом.

Основы работы с HTML

Форматирование символов
Для маркировки переменных используется тег , который обычно отображается курсивом. Версии стандарта HTML обычно маркируются следующим образом x.у. Пример выполнения данного HTML-кода Тег маркирует контактную информацию для всего документа или его части. Он может включать имена людей осуществляющих поддержку документа, ссылки на страницы, адреса электронной почты, телефоны и прочее. Использование данного тега для маркировки почтовых адресов организаций является не совсем корректным. Его следует использовать только для пометки адресов для связи по поводу документа. Также допустимо использование тега для выделения контактной информации по поводу части документа, обычно формы. Информация о кредитной карте Visa Mastercard Номер: Срок действия: Если у вас имеются вопросы по поводу заказа свяжитесь с нами по адресу orders@htmlhelp.com, Или телефону в офисе 555-5555. Пример выполнения данного HTML-кода Этот пример показывает, как работать с сокращениями или акронимами. СНГ WWW При наведении указателя мыши на акроним или сокращение показывается атрибут title. Это работает по-разному в разных браузерах. Пример выполнения данного HTML-кода Этот пример показывает, как изменять направление вывода текста. Если используемый браузер поддерживает двунаправленное представление (bdo), то следующая строка будет записана справа налево (rtl): Здесь какой-то арабский текст Пример выполнения данного HTML-кода Этот пример показывает, как использовать длинные и короткие цитаты. Здесь представлена длинная цитата: Это длинная цитата. Это длинная цитата. Это длинная цитата. Это длинная цитата. Это длинная цитата. Здесь представлена короткая цитата: Это короткая цитата Для элемента blockquote браузер вставляет дополнительные перенос строки, пустые строки и поля, но элемент q не изображается каким-то специальным образом. Пример выполнения данного HTML-кода Этот пример показывает, как пометить текст, который удален или вставлен в документ. дюжина означает двадцать двенадцать pieces Большинство браузеров будет зачеркивать удаленный текст и подчеркивать вставленный текст. Некоторые старые браузеры будут выводить удаленный или вставленный текст как обычный текст. Пример выполнения данного HTML-кода Форматирование текста Если необходимо чтобы к тексту было применено какое-либо форматирование, например, выделение полужирным или курсивом, необходимо использовать соответствующие теги форматирования. При этом форматируемый текст помещается между тегами. Пример выполнения данного HTML-кода Так же для выделения текста используются теги и , данные теги являются контейнерами и требуют закрывающегося тега. Тег сообщает браузеру, что на заключенном в нем тексте необходимо сделать сильное ударение. Обычно визуальные браузеры отображают содержимое данного тега полужирным шрифтом, но это может быть легко изменено с помощью таблицы стилей. Так как данный тег является структурным, он несет смысловую нагрузку, в отличие от тега , который лишь форматирует текст полужирным, то его использование предпочтительней. Тег тоже акцентирует внимание на заключенном внутри тексте, но он считается менее сильным ударением. Отображается он как правило курсивом. По тем же причинам использование предпочтительней чем применение . Сравните как будет отформатирован следующий текст. Данный параграф отформатирован тегом strong А этот тегом b, внешне они не отличаются. Данный параграф отформатирован тегом em А этот тегом i, внешне они не отличаются. Пример выполнения данного HTML-кода Еще одной парой тегов форматирования являются теги и . Первый выводит текст увеличенным по сравнению со стандартным, а второй уменьшенным. Вместо тега рекомендуется использовать теги или теги заголовков, так как они несут и структурную нагрузку. Тег является тегом по смыслу противоположным и , он деакцентирует внимание на тексте. По поводу применения этого тега следует сделать одно замечание: на разных компьютерах установлено различное разрешение экрана и в браузере может быть установлен различный размер основного шрифта и сильное уменьшение текста может сделать текст не читаемым. Следующий пример демонстрирует вид текста отформатированного с помощью этих тегов. Данный параграф отформатирован тегом big Данный параграф отформатирован тегом small А в данном параграфе теги не применяются Пример выполнения данного HTML-кода Другой парой полезных тегов являются ^{- верхний индекс и _{- нижний индекс. Которые могут быть полезными при написании математических и химических формул. Сравните формулы набранные различным способом Формула воды H2O. В данном параграфе формула набрана без использования тега sub Формула воды H₂O. В данном параграфе формула набрана с использованием тега sub Формула выглядит более привычно. 2^4=16. В данном параграфе формула набрана без использования тега sup 2⁴=16. В данном параграфе формула набрана с использованием тега sup Формула выглядит более привычно. Пример выполнения данного HTML-кода В некоторых случаях, например для вывода кода программ, полезным будет использование тега , который сообщает браузеру, что находящийся внутри текст должен быть выведен как есть. При этом будут сохранены все пробелы переносы строк и прочие символы, которые обычно при выводе браузером не отображаются. Этот пример показывает, как можно управлять переносами строк и пробелами с помощью тега . Это предварительно форматированный текст. Он сохраняет как пробелы так и переносы строк. Пример выполнения данного HTML-кода Сравните написание кода программы с применением тега и без его использования. // Данный фрагмент набран с использованием тега for (int i = 1; i < 10; i++) { printf ("i=%i\n, i); } // Здесь тег не применялся for (int i = 1; i < 10; i++) { printf ("i=%i\n", i); } Пример выполнения данного HTML-кода Тег маркирует код компьютерной программы. Браузеры обычно отображают его моноширинным шрифтом. Этот элемент является структурным, поэтому его использование предпочтительней использования тега , который маркирует моноширный текст. Также следует отметить, что тег лучше использовать внутри тега , так как в противном случае, все множественные пробелы будут заменены одним. Тег маркирует текст введенный с клавиатуры. Отображается он также, как и текст внутри тега Данные примеры демонстрируют то как будет представлен текст при использовании разных тегов // отформатировано с помощью и class helloworld { public static void main(string[] args) { system.out.println("hello world!"); } } // отформатировано с помощью и class helloworld { public static void main(string[] args) { system.out.println("hello world!"); } } // отформатировано с помощью class helloworld { public static void main(string[] args) { system.out.println("hello world!"); } } Использование тега Сохранить результат Да/Нет Пример выполнения данного HTML-кода Для маркировки примера вывода программы или скрипта используется тег . Если в HTML коде встретится ошибка, то будет выдано следующее: c:\sp\bin\nsgmlsu.exe:test.html:4:7:e: element "foobar" undefined Пример выполнения данного HTML-кода Версии стандарта HTML обычно маркируются следующим образом x.у. Пример выполнения данного HTML-кода Тег маркирует контактную информацию для всего документа или его части. Он может включать имена людей осуществляющих поддержку документа, ссылки на страницы, адреса электронной почты, телефоны и прочее. Использование данного тега для маркировки почтовых адресов организаций является не совсем корректным. Его следует использовать только для пометки адресов для связи по поводу документа. Также допустимо использование тега для выделения контактной информации по поводу части документа, обычно формы. Информация о кредитной карте Visa Mastercard Номер: Срок действия: Если у вас имеются вопросы по поводу заказа свяжитесь с нами по адресу orders@htmlhelp.com, Или телефону в офисе 555-5555. Пример выполнения данного HTML-кода Этот пример показывает, как работать с сокращениями или акронимами. СНГ WWW При наведении указателя мыши на акроним или сокращение показывается атрибут title. Это работает по-разному в разных браузерах. Пример выполнения данного HTML-кода Этот пример показывает, как изменять направление вывода текста. Если используемый браузер поддерживает двунаправленное представление (bdo), то следующая строка будет записана справа налево (rtl): Здесь какой-то арабский текст Пример выполнения данного HTML-кода Этот пример показывает, как использовать длинные и короткие цитаты. Здесь представлена длинная цитата: Это длинная цитата. Это длинная цитата. Это длинная цитата. Это длинная цитата. Это длинная цитата. Здесь представлена короткая цитата: Это короткая цитата Для элемента blockquote браузер вставляет дополнительные перенос строки, пустые строки и поля, но элемент q не изображается каким-то специальным образом. Пример выполнения данного HTML-кода Этот пример показывает, как пометить текст, который удален или вставлен в документ. дюжина означает двадцать двенадцать pieces Большинство браузеров будет зачеркивать удаленный текст и подчеркивать вставленный текст. Некоторые старые браузеры будут выводить удаленный или вставленный текст как обычный текст. Пример выполнения данного HTML-кода Исходный код HTML-документа Полезно изучать код Web-страниц, сделанных другими. Такую возможность предоставляют все популярные браузеры. Для этого в меню кнопке View ("Вид") браузера следует выбрать Source ("Исходный код") или Page Source ("Код страницы"). Откроется окно, в котором будет показан фактический код HTML страницы. Таблица тегов управления формой отображенияТегОписание Задает жирный текст Относительное увеличение текста Выделяет текст (обычно курсив) Задает курсив Относительное уменьшение текста Акцентирует текст (обычно жирный) Определяет нижний индекс Определяет верхний индекс Вставленный текст Удаленный текст Не рекомендуется. Используйте вместо этого Не рекомендуется. Используйте вместо этого Не рекомендуется. Используйте вместо этого стили (style) Таблица тегов управления типом информацииТегОписание Определяет текст кода программы Определяет текст клавиатуры Определяет образец кода программы Определяет текст телетайпа Определяет переменную Определяет заранее отформатированный текст Не рекомендуется. Используйте вместо этого </td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого <pre> </td></tr><tr><td bgcolor="#eaeaea" valign="top"><xmp></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого <pre> </td></tr></table><table border=1>Таблица тегов цитирования, сносок и определения<tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top"><abbr></td><td bgcolor="#eaeaea" valign="top">Определяет сокращение</td></tr><tr><td bgcolor="#eaeaea" valign="top"><acronym></td><td bgcolor="#eaeaea" valign="top">Определяет акроним</td></tr><tr><td bgcolor="#eaeaea" valign="top"><address></td><td bgcolor="#eaeaea" valign="top">Определяет элемент address (адрес)</td></tr><tr><td bgcolor="#eaeaea" valign="top"><bdo></td><td bgcolor="#eaeaea" valign="top">Определяет направление вывода текста</td></tr><tr><td bgcolor="#eaeaea" valign="top"><blockquote></td><td bgcolor="#eaeaea" valign="top">Определяет длинную цитату</td></tr><tr><td bgcolor="#eaeaea" valign="top"><q></td><td bgcolor="#eaeaea" valign="top">Определяет короткую цитату</td></tr><tr><td bgcolor="#eaeaea" valign="top"><cite></td><td bgcolor="#eaeaea" valign="top">Определяет сноску на другой материал</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dfn></td><td bgcolor="#eaeaea" valign="top">Используется для определения термина</td></tr></table><br><br> <h1>Неразрывный пробел</h1> Наиболее часто используемым символьным объектом является неразрывный пробел -  . Обычно браузер удаляет лишние пробелы и вместо нескольких использует один, если необходимо вставить в текст пробелы, используется символьный объект  . Еще одно частое применение неразрывного пробела заполнение пустых ячеек в таблице, так большинство браузеров не отображает ячейки, в которых ничего нет.<br><table border=1>Таблица наиболее часто используемых символьных объектов<tr>РезультатОписаниеИмя объектаНомер объекта</tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">неразрывный пробел</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top"><</td><td bgcolor="#eaeaea" valign="top">меньше</td><td bgcolor="#eaeaea" valign="top"><</td><td bgcolor="#eaeaea" valign="top"><</td></tr><tr><td bgcolor="#eaeaea" valign="top">></td><td bgcolor="#eaeaea" valign="top">больше</td><td bgcolor="#eaeaea" valign="top">></td><td bgcolor="#eaeaea" valign="top">></td></tr><tr><td bgcolor="#eaeaea" valign="top">&</td><td bgcolor="#eaeaea" valign="top">амперсанд</td><td bgcolor="#eaeaea" valign="top">&</td><td bgcolor="#eaeaea" valign="top">&</td></tr><tr><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">двойная кавычка</td><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">"</td></tr><tr><td bgcolor="#eaeaea" valign="top">'</td><td bgcolor="#eaeaea" valign="top">апостроф</td><td bgcolor="#eaeaea" valign="top">' </td><td bgcolor="#eaeaea" valign="top">' (не работает в IE)</td></tr><tr><td bgcolor="#eaeaea" valign="top">?</td><td bgcolor="#eaeaea" valign="top">цент</td><td bgcolor="#eaeaea" valign="top">¢</td><td bgcolor="#eaeaea" valign="top">¢</td></tr><tr><td bgcolor="#eaeaea" valign="top">?</td><td bgcolor="#eaeaea" valign="top">фунт стерлингов</td><td bgcolor="#eaeaea" valign="top">£</td><td bgcolor="#eaeaea" valign="top">£</td></tr><tr><td bgcolor="#eaeaea" valign="top">?</td><td bgcolor="#eaeaea" valign="top">йена</td><td bgcolor="#eaeaea" valign="top">¥</td><td bgcolor="#eaeaea" valign="top">¥</td></tr><tr><td bgcolor="#eaeaea" valign="top">§</td><td bgcolor="#eaeaea" valign="top">параграф</td><td bgcolor="#eaeaea" valign="top">§</td><td bgcolor="#eaeaea" valign="top">§</td></tr><tr><td bgcolor="#eaeaea" valign="top">©</td><td bgcolor="#eaeaea" valign="top">авторское право</td><td bgcolor="#eaeaea" valign="top">©</td><td bgcolor="#eaeaea" valign="top">©</td></tr><tr><td bgcolor="#eaeaea" valign="top">®</td><td bgcolor="#eaeaea" valign="top">зарегистрированная торговая марка</td><td bgcolor="#eaeaea" valign="top">®</td><td bgcolor="#eaeaea" valign="top">®</td></tr><tr><td bgcolor="#eaeaea" valign="top">?</td><td bgcolor="#eaeaea" valign="top">умножение</td><td bgcolor="#eaeaea" valign="top">×</td><td bgcolor="#eaeaea" valign="top">×</td></tr><tr><td bgcolor="#eaeaea" valign="top">?</td><td bgcolor="#eaeaea" valign="top">деление</td><td bgcolor="#eaeaea" valign="top">÷</td><td bgcolor="#eaeaea" valign="top">÷</td></tr></table><br> Полный список символьных объектов HTML представлен в Справочнике объектов HTML.<br><br> <h1>либо форматирование, например, выделение полужирным </h1> Если необходимо чтобы к тексту было применено какое- либо форматирование, например, выделение полужирным или курсивом, необходимо использовать соответствующие теги форматирования. При этом форматируемый текст помещается между тегами. <br><br> <br> Данный параграф отформатирован тегом <strong><br> А этот тегом <b>, внешне они не отличаются.<br> Данный параграф отформатирован тегом <em><br> А этот тегом <i>, внешне они не отличаются.<br><br> <br> Данный параграф отформатирован тегом <big><br> Данный параграф отформатирован тегом <small><br> А в данном параграфе теги не применяются<br><br> <br> Формула воды H2O. В данном параграфе формула набрана без использования тега <sub><br> Формула воды H2O. В данном параграфе формула набрана с использованием тега <sub> Формула выглядит более привычно.<br> 2^4=16. В данном параграфе формула набрана без использования тега <sup><br> 24=16. В данном параграфе формула набрана с использованием тега <sup> Формула выглядит более привычно.<br><br> <br> Это предварительно форматированный текст. Он сохраняет как пробелы так и переносы строк.<br><br> <br> // Данный фрагмент набран с использованием тега <pre> for (int i = 1; i < 10; i++) { printf (“i=%i\n”, i); }<br> // Здесь тег <pre& gt не применялся for (int i = 1; i < 10; i++) { printf (“i=%i\n”, i); } <br><br> <h1>Символьные элементы</h1> Некоторые символы, такие как символ <, имеют в HTML специальное значение. Поэтому их нельзя использовать в тексте в явном виде. Для их отображения используются символьные элементы CER (Character Entity Reference).<br>Для представления символа "<" в теле документа HTML используется <, а для символа ">" используется >. Символьный элемент отображается в виде:<br> &имя_символа;<br> или<br> &#номер_символа;<br> Например, знак меньше (<) изображается в виде: < или <.<br>Преимущество использования имени вместо номера состоит в том, что имя легче запомнить. Недостаток состоит в том, что не все браузеры поддерживают самые новые имена объектов, в то время как поддержка номеров объектов реализована очень хорошо почти во всех браузерах. Обратите внимание, что символьные объекты зависят от регистра символов.<br>Следующий пример позволит поэкспериментировать с символьными объектами.<br>Символьные объекты. Работает только в Internet Explorer.<br> <html> <body><br> Это символьный объект: <br><br> Попробуйте заменить номер (000) на другой номер (например, 169), сохраните измененный текст и перезагрузите страницу в браузере, чтобы увидеть результат. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1> Основы работы с HTML </h1> <h1>Фрейм навигации</h1> Этот пример показывает, как сделать фрейм навигации. Фрейм навигации содержит список ссылок, указывающих на второй фрейм.<br> <html><br> <frameset cols="120,*"> <frame src="menu.htm"> <frame src="frame_1.htm" name="frame_1"> </frameset><br> </html><br> Пример выполнения данного HTML-кода<br>Файл с именем "menu.htm" содержит ссылки на другие документы HTML, которые будут загружаться в frame_1. Исходный код для ссылок:<br> <a href ="file_1.htm" target ="frame_1">Файл 1</a><br> <a href ="file_2.htm" target ="frame_1">Файл 2</a><br> <a href ="file_3.htm" target ="frame_1">Файл 3</a><br><br> <h1>Фреймы HTML</h1> Фреймы используются для разбивки окна браузера на несколько независимых частей, каждая из которых представляет собой отдельный HTML-документ. Наиболее частое применение фреймов это отделение меню от основного информационного наполнения. Хотя фреймы достаточно удобная вещь использование их не рекомендуется. Следует внимательно следить за тем чтоб теги формирующие фреймовую структуру располагались вне тегов <body>, так как они не относятся к телу документа.<br><br> <h1>Горизонтальные и вертикальные фреймы</h1> Этот пример показывает, как сделать набор фреймов с тремя документами, и как разделить их на строки и столбцы. При этом не все границы фреймов можно передвинуть.<br> <html><br> <frameset rows="50%,50%"> <frame src="frame_1.htm"> <frameset cols="25%,75%"> <frame noresize="noresize" src="frame_2.htm"> <frame src="frame_3.htm"> </frameset> </frameset> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Изображение в качестве ссылки</h1> Этот пример показывает, как использовать в качестве ссылки изображение.<br> <html> <body> Можно также использовать в качестве ссылки изображение: <a href=" http://www.intuit.ru/"> <img border="0" src="logo.gif" width="285" height="52"> </a> <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Набор горизонтальных фреймов</h1> Этот пример показывает, как создать набор горизонтальных фреймов с тремя различными документами.<br> <html><br> <frameset rows="25%,50%,25%"><br> <frame src="frame_1.htm"> <frame src="frame_2.htm"> <frame src="frame_3.htm"><br> </frameset><br> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Набор вертикальных фреймов</h1> Этот пример показывает, как создать набор вертикальных фреймов с тремя различными документами.<br> <html><br> <frameset cols="50%,25%,25%"><br> <frame src="frame_1.htm"> <frame src="frame_2.htm"> <frame src="frame_3.htm"><br> </frameset><br> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Описание тега гипертекстовой ссылки</h1> Якорь (аnchor) позволяет устанавливать связь с любыми ресурсами во Всемирной Сети: другую страницу HTML, изображение, звуковой файл, видеоклип, и т.д.<br>Синтаксис тега гипертекстовой ссылки:<br> <a href="url">текст ссылки</a><br> При помощи атрибута href передается адрес документа, на который указывает ссылка.<br><a href="http://www.intuit.ru/">Добро пожаловать в ИНТУИТ!</a><br> Такой же синтаксис используется для перехода во вложенную папку, например в папку "Помощь" на сайте Интернет-Университета Информационных Технологий используется код:<br> <a href="http://www.intuit.ru/help/">Страница помощи на сайте ИНТУИТ!</a><br> Всегда добавляйте завершающую косую черту к ссылкам на вложенные папки. Если ссылка имеет следующий вид: href="http://www.intuit.ru/help", то будет создано два запроса HTTP к серверу, так как сервер добавит косую черту к адресу и создаст новый запрос следующего вида: href="http://www.intuit.ru/help/". При этом вызове обращение обычно происходит к странице index.htm внутри папки help или к другому файлу – это зависит от настроек web-сервера.<br>С помощью данного атрибута можно задавать ссылки не только по протоколу HTTP, но и по другим:<br><li>http://... - создает ссылку на www-документ;</li><li>ftp://... - создает ссылку на ftp-сайт или расположенный на нем файл;</li><li>mailto:... - запускает почтовую программу-клиент с заполненным полем имени получателя. Если после адреса поставить знак вопроса, то можно указать дополнительные атрибуты, разделенные знаком "&";</li><li>news:.. - создает ссылку на конференцию сервера новостей;</li><li>telnet://... - создает ссылку на telnet-сессию с удаленной машиной;</li><li>wais://... - создает ссылку на WAIS - сервер;</li><li>gopher://... - создает ссылку на Gopher - сервер;</li><br> С помощью атрибута target можно определить, где будет открыт документ, на который указывает ссылка. В качестве значения необходимо задать либо имя одного из существующих фреймов, либо одно из следующих зарезервированных имен:<br><li>_self - указывает, что определенный в параметре href документ должен отображаться в текущем фрейме;</li><li>_parent - указывает, что документ должен отображаться во фрейме-родителе текущего фрейма. Иначе говоря, _parent ссылается на окно, содержащее frameset, включающий текущий фрейм;</li><li>_top - указывает, что документ должен отображаться в окне-родителе всей текущей фрэймовой структуры;</li><li>_blank - указывает, что документ должен отображаться в новом окне.</li><br> <br> <html> <body> <a href="http://www.intuit.ru/" target="_blank">Добро пожаловать в ИНТУИТ!</a> <a href="http://www.intuit.ru/" target="_parent">Добро пожаловать в ИНТУИТ!</a> <a href="http://www.intuit.ru/" target="_top">Добро пожаловать в ИНТУИТ!</a> <a href="http://www.intuit.ru/" target="_self">Добро пожаловать в ИНТУИТ!</a> </body> </html><br> Пример выполнения данного HTML-кода<br>Для перехода внутри страницы к конкретному разделу используют атрибут name тега гипертекстовой ссылки a, при помощи которого создается именованный якорь.<br> <a name="label">ссылка на именованный якорь</a><br> В данном примере внутри документа создается своеобразная метка, при этом именованный якорь никак не отображается в окне браузера.<br>Для перехода на место, которое отмечено именованным якорем используется знак # и имя якоря в конце URL следующим образом:<br> <a href="page1.html#label">переход на именованный якорь </a><br> Переход внутри файла "page1.html" на именованный якорь выглядит следующим образом:<br> <a href="#label">переход на именованный якорь </a><br> Если браузер не сможет найти указанный именованный якорь на вызываемой странице, то переход произойдет на начало документа, при этом сообщения об ошибке доступа не возникает.<br><br> <h1>Открытие ссылки в новом окне браузера</h1> Этот пример показывает, как открыть ссылку на другую страницу в новом окне, чтобы посетителю не нужно было покидать ваш Web-сайт.<br> <html> <body><br> <a href="lastpage.htm" target="_blank">Последняя страница</a><br> Если задать атрибут target ссылки как "_blank", то ссылка будет открыта в новом окне. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>является ссылкой на страницу на </h1> <a href="page1.htm"><br> Этот текст</a> является ссылкой на страницу на этом Web-сайте. <br> <a href="http://www.intuit.ru/"><br> Этот текст </a> является ссылкой на страницу во Всемирной Паутине. <br><br> <br> Можно также использовать в качестве ссылки изображение: <a href=" http://www.intuit.ru/"><br> <img src="image/primer-2_1.gif" alt="является ссылкой на страницу на "><br> </a><br><br> <br> Добро пожаловать в ИНТУИТ!<br> Добро пожаловать в ИНТУИТ!<br> Добро пожаловать в ИНТУИТ!<br> Добро пожаловать в ИНТУИТ!<br><br> <br> Последняя страница<br> Если задать атрибут target ссылки как "_blank", то ссылка будет открыта в новом окне. <br><br> <h1>Создание гиперссылок</h1> Этот пример показывает, как создавать ссылки в документе HTML.<br> <html> <body><br> <a href="page1.htm"> Этот текст</a> является ссылкой на страницу на этом Web-сайте. <br><br> <a href="http://www.intuit.ru/"> Этот текст </a> является ссылкой на страницу во Всемирной Паутине. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Создание ссылки mailto</h1> Этот пример показывает, как соединиться с сообщением mail (будет работать только, если установлена служба mail).<br> <html> <body><br> Это ссылка на почтовые адреса: <a href="mailto:help@intuit.ru?сс=orders@intuit.ru&bcc=admin@intuit.ru&subject=Тестовый%20запрос!"> отправить запрос</a> <br><br> При помощи этой ссылки отправляется письмо по адресу электронной почты help@intuit.ru, его копия на адрес orders@intuit.ru и скрытая копия на адрес admin@intuit.ru. Для корректной обработки заголовка письма необходимо пробелы заменять на %20.<br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Ссылка в определенное место на той же странице</h1> Этот пример показывает, как использовать ссылку на другую часть документа.<br> <html> <body><br> <a href="#part5">Переход на часть 5.</a> <br><br> <h1>Лекция 1</h1><br> <h2>Часть 1</h2> Это первая часть ... <br><br> <h2> Часть 2</h2> Это вторая часть ...<br><br> <h2> Часть 3</h2> Это третья часть ...<br><br> <h2> Часть 4</h2> Это четвертая часть ...<br><br> <h2><a name="part5"> Часть 5</h2> Это пятая часть ...<br><br> <h2> Часть 6</h2> Это шестая часть ...<br><br> <h2> Часть 7</h2> Это седьмая часть ...<br><br> <h2> Часть 8</h2> Это восьмая часть ...<br><br> <h2> Часть 9</h2> Это девятая часть ...<br><br> <h2> Часть 10</h2> Это десятая часть ...<br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Теги для работы с фреймами</h1> Тег <frameset> определяет, как разделить окно на фреймы. Каждый frameset определяет набор строк или столбцов. Значения rows/cols указывают величину области экрана, которую будут занимать каждая строка/столбец. Атрибут framespacing - определяет расстояние между фреймами в пикселах.<br>Тег <frameset> является контейнером для всех остальных тегов фреймов. Между начальным и конечным тэгами кроме элементов <frame> и <noframe> могут находиться другие элементы <frameset>. То есть элемент <frameset> поддерживает вложенные конструкции фреймов.<br>Тег <frame> определяет, какой документ HTML поместить в каждый фрейм. Тег <frame> имеет атрибут noresize="noresize", который запрещает изменять размер фрейма пользователю.<br>В примере ниже задана фреймовая структура с двумя столбцами. Для первого столбца задано 25% ширины окна браузера. Для второго фрейма задано 75% ширины окна браузера. В первый столбец помещается документ HTML "frame_1.htm", а во второй столбец помещается документ HTML "frame_2.htm":<br> <frameset cols="25%,75%"> <frame src="frame_1.htm"> <frame src="frame_2.htm"> </frameset><br> Необходимо учитывать, что браузер может не поддерживать фреймы, в этом случае следует использовать тег <noframes>.<br>При использовании фреймов теги <body></body> не используются. Однако, если добавить тег <noframes>, содержащий некоторый текст для браузеров, которые не поддерживают фреймы, необходимо будет поместить этот текст между тегами <body></body>. Например,<br> <html><br> <frameset cols="25%,50%,25%"> <frame src="frame_1.htm"> <frame src="frame_2.htm"> <frame src="frame_3.htm"><br> <noframes> <body>Ваш браузер не поддерживает фреймы!</body> </noframes><br> </frameset> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Встроенный фрейм</h1> Этот пример показывает, как создать встроенный фрейм (фрейм внутри страницы HTML).<br> <html> <body><br> <iframe src="menu.html"></iframe><br> Некоторые старые браузеры не поддерживают iframes.<br> В этом случае встроенный фрейм (iframe) не будет виден.<br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1> Основы работы с HTML </h1> <h1>Атрибут frame</h1> <html> <body><br> Если никакие границы кадра таблицы в этих примерах не видны, то используемый браузер слишком старый, или не поддерживает их. <br><br> <h4> frame="border":</h4> <table frame="border"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table><br> <h4> frame="box":</h4> <table frame="box"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table><br> <h4>frame="void":</h4> <table frame="void"> <tr> <td>Первая </td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table><br> <h4>frame="above":</h4> <table frame="above"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table><br> <h4>frame="below":</h4> <table frame="below"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table><br> <h4>frame="hsides":</h4> <table frame="hsides"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table><br> <h4>frame="vsides":</h4> <table frame="vsides"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table><br> <h4>frame="lhs":</h4> <table frame="lhs"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table><br> <h4>frame="rhs":</h4> <table frame="rhs"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Фоновый цвет или фоновое изображение в ячейке таблицы</h1> <html> <body><br> <h4>Ячейки с фоном:</h4> <table border="1"> <tr> <td bgcolor="red">Первая</td> <td>Строка</td> </tr> <tr> <td background="bg.jpg"> Вторая</td> <td>Строка</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Использование в таблице фонового цвета или фонового изображения</h1> <html> <body><br> <h4>Фоновый цвет (bgcolor):</h4> <table border="1" bgcolor="red"> <tr> <td>Первая </td> <td>Строка </td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table><br> <h4>Фоновое изображение (background):</h4> <table border="1" background="bg.jpg"> <tr> <td>Первая</td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Ячейка, которая охватывает два столбца:</h1> <table border=1><br> <tr> Организация<br> Телефон<br> </tr> <tr> <td>Интернет-Университет Информационных Технологий</td> <td>253-9312</td> <td>253-9313</td> </tr> </table><br><br> <h1>Ячейка, которая охватывает две строки:</h1> <table border=1><br> <tr> Организация:<br> <td> Интернет-Университет Информационных Технологий </td> </tr> <tr> Телефон:<br> <td>253-9312</td> </tr> <tr> <td>253-9313</td> </tr> </table><br><br> <h1>Ячейки таблицы, которые охватывают более одной строки/столбца</h1> <html> <body><br> <h4>Ячейка, которая охватывает два столбца:</h4> <table border="1"> <tr> <th>Организация</th> <th colspan="2">Телефон</th> </tr> <tr> <td>Интернет-Университет Информационных Технологий</td> <td>253-9312</td> <td>253-9313</td> </tr> </table><br> <h4>Ячейка, которая охватывает две строки:</h4> <table border="1"> <tr> <th>Организация:</th> <td> Интернет-Университет Информационных Технологий </td> </tr> <tr> <th rowspan="2">Телефон:</th> <td>253-9312</td> </tr> <tr> <td>253-9313</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Эта таблица имеет заглавие и толстую рамку:</h1> <table border=1><br> Заглавие<br> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table><br><br> <h1>Отступ от рамки до содержимого ячейки</h1> <html> <body><br> <h4>Без отступа:</h4> <table border="1"> <tr> <td>Первая </td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка</td> </tr> </table><br> <h4>С отступом (cellpadding) :</h4> <table border="1" cellpadding="10"> <tr> <td>Первая</td> <td>Строка</td> </tr> <tr> <td>Вторая</td> <td>Строка</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Как можно видеть, одна из </h1> <table border=1><br> <tr> <td>Некоторый текст </td> <td>Некоторый текст </td> </tr> <tr> <td></td> <td>Некоторый текст </td> </tr> </table><br> Как можно видеть, одна из ячеек не имеет рамки. Это потому, что она пустая. Попробуйте вставить в ячейку пробел. Она по-прежнему не будет иметь рамки. <br> Хитрость состоит в том, чтобы вставить в ячейку неразрывный пробел. <br> Неразрывный пробел является символьным объектом. <br> Объект неразрывного пробела начинается с амперсанда ("&"), затем следуют буквы "nbsp", и в конце стоит точка с запятой (";") <br><br> <br> <table border=1><br> <tr> <td> Это параграф <br> Это другой параграф <br> </td> <td>Эта ячейка содержит таблицу:</td></tr></table> <table border=1><br> <tr> <td>A</td> <td>B</td> </tr> <tr> <td>C</td> <td>D</td> </tr> </table><br> <tr> <td> Эта ячейка содержит список <br> <li>элемент 1</li><br> <li>элемент 2</li><br> <li>элемент 3</li><br> </td> <td>КОНЕЦ</td> </tr> <br> <table border=1><br> <tr> Опубликовано курсов<br> 2004<br> 2005<br> </tr> <tr> <td>Базы данных</td> <td>2</td> <td>3</td> </tr> <tr> <td>Программирование</td> <td>4</td> <td>5</td> </tr> <tr> <td>Интернет-технологии</td> <td>2</td> <td>3</td> </tr> <tr> всего<br> 8<br> 11<br> </tr> </table> <h1>Рассмотрим вышеизложенное на примерах различного </h1> Рассмотрим вышеизложенное на примерах различного вида таблиц.<br> <html> <body><br> Каждая таблица начинается с тега table. Каждая строка таблицы начинается с тега tr. Каждый элемент данных таблицы начинается с тега td. <br><br> <h1>Это пример простейшей таблицы, содержащей одну строку и одну ячейку.</h1> <table border="1"> <tr> <td>Одна строка и одна ячейка</td> </tr> </table><br> <h1>Одна строка и три столбца:</h1> <table border="1"> <tr> <td> столбец 1</td> <td> столбец 2</td> <td> столбец 3</td> </tr> </table><br> <h1>Две строки и три столбца:</h1> <table border="1"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> </table><br> </body> </html><br> <h1>Рамка таблицы</h1><br> <html> <body> <h1>Обычная рамка:</h1> <table border="1"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table><br> <h1>Толстая рамка:</h1> <table border="10"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table><br> </body> </html><br> <table border="1"> <tr> <td>строка 1, ячейка 1</td> <td>строка 1, ячейка 2</td> </tr> <tr> <td>строка 2, ячейка 1</td> <td>строка 2, ячейка 2</td> </tr> </table><br> Пример выполнения данного HTML-кода<br>Для тега table определены следующие аттрибуты.<br><li>align - определяет способ горизонтального выравнивания таблицы на странице. Возможные значения: left, center, right. Значение по умолчанию - left.</li><li>valign - должен определять способ вертикального выравнивания для содержимого таблицы. Возможные значения: top, bottom, middle.</li><li>border - определяет ширину внешней рамки таблицы (в пикселах). При BORDER="0" или при отсутствии этого параметра рамка отображаться не будет.</li><li>cellpadding - определяет расстояние (в пикселах) между рамкой каждой ячейки таблицы и содержащимся в ней материалом.</li><li>cellspacing - определяет расстояние (в пикселах) между границами соседних ячеек.</li><li>width - определяет ширину таблицы. Ширина задается либо в пикселах, либо в процентном отношении к ширине окна браузера. По умолчанию этот параметр определяется автоматически в зависимости от объема содержащегося в таблице материала.</li><li>height - определяет высоту таблицы. Высота задается либо в пикселах, либо в процентном отношении к высоте окна браузера. По умолчанию этот параметр определяется автоматически в зависимости от объема содержащегося в таблице материала.</li><li>bgcolor - определяет цвет фона ячеек таблицы. Задается либо RGB-значением в шестнадцатиричной системе, либо одним из 16 базовых цветов.</li><li>background - позволяет заполнить фон таблицы рисунком. В качестве значения необходимо указать URL рисунка.</li><br><br> <br> Ячейки таблицы без содержимого в большинстве браузеров выводятся не очень хорошо. Если необходимо сделать ячейку таблицы пустой, то разместите в ней неразрывный пробел  <br>Такие элементы как <thead>,<tbody> и <tfoot> используются редко в связи с тем, что не все браузеры их поддерживают.<br>Для тегов <td> и <th> очень полезными являются атрибуты colspan и rowspan. Первый показывает сколько ячеек надо объединить по горизонтали, а второй по вертикали. Следует заметить, что если мы применяем объединение ячеек, то общее число ячеек с учетом объединенных должно быть равным. Продемонстрируем на примере.<br> <html> <body><br> <h4>Правильное применение colspan:</h4> <table border="1"> <tr> <td colspan="2">100</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table><br> <h4>Неправильное применение colspan:</h4> <table border="1"> <tr> <td colspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table><br> <h4>Правильное применение rowspan:</h4> <table border="1"> <tr> <td rowspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>500</td> <td>600</td> </tr> </table><br> <h4>Неправильное применение rowspan:</h4> <table border="1"> <tr> <td rowspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Пустые ячейки</h1> <html> <body><br> <table border="1"> <tr> <td>Некоторый текст </td> <td>Некоторый текст </td> </tr> <tr> <td></td> <td>Некоторый текст </td> </tr> </table><br> Как можно видеть, одна из ячеек не имеет рамки. Это потому, что она пустая. Попробуйте вставить в ячейку пробел. Она по-прежнему не будет иметь рамки. <br><br> Хитрость состоит в том, чтобы вставить в ячейку неразрывный пробел. <br><br> Неразрывный пробел является символьным объектом. <br><br> Объект неразрывного пробела начинается с амперсанда ("&"), затем следуют буквы "nbsp", и в конце стоит точка с запятой (";") <br><br> <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Расстояние между ячейками</h1> <html> <body><br> <h4>Расстояние между ячейками не задано:</h4> <table border="1"> <tr> <td>Первая </td> <td>Строка </td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table><br> <h4>Расстояние между ячейками (cellspacing) задано:</h4> <table border="1" cellspacing="10"> <tr> <td>Первая </td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Таблица без рамки</h1> <html> <body><br> <h4>Эта таблица не имеет рамки:</h4> <table> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table><br> <h4>И эта таблица не имеет рамки:</h4> <table border="0"> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Теги таблиц</h1> <table border=1><tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top"><table></td><td bgcolor="#eaeaea" valign="top">Определяет таблицу</td></tr><tr><td bgcolor="#eaeaea" valign="top"><th></td><td bgcolor="#eaeaea" valign="top">Определяет заголовки в таблице</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tr></td><td bgcolor="#eaeaea" valign="top">Определяет строку таблицы</td></tr><tr><td bgcolor="#eaeaea" valign="top"><td></td><td bgcolor="#eaeaea" valign="top">Определяет ячейку таблицы</td></tr><tr><td bgcolor="#eaeaea" valign="top"><caption></td><td bgcolor="#eaeaea" valign="top">Определяет заглавие таблицы</td></tr><tr><td bgcolor="#eaeaea" valign="top"><colgroup></td><td bgcolor="#eaeaea" valign="top">Определяет группы столбцов таблицы</td></tr><tr><td bgcolor="#eaeaea" valign="top"><col></td><td bgcolor="#eaeaea" valign="top">Определяет значения атрибутов для одного или нескольких столбцов таблицы</td></tr><tr><td bgcolor="#eaeaea" valign="top"><thead></td><td bgcolor="#eaeaea" valign="top">Определяет заголовок группы строк таблицы</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tbody></td><td bgcolor="#eaeaea" valign="top">Определяет тело группы строк таблицы</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tfoot></td><td bgcolor="#eaeaea" valign="top">Определяет нижний заголовок группы строк таблицы</td></tr></table><br><br> <h1>Теги внутри таблицы</h1> <html> <body> <table border="1"> <tr> <td> Это параграф <br> Это другой параграф <br> </td> <td>Эта ячейка содержит таблицу: <table border="1"> <tr> <td>A</td> <td>B</td> </tr> <tr> <td>C</td> <td>D</td> </tr> </table> </td> </tr> <tr> <td>Эта ячейка содержит список <li>элемент 1</li> <li>элемент 2</li> <li>элемент 3</li> </td> <td>КОНЕЦ</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Вертикальные заголовки:</h1> <table border=1><br> <tr> Фамилия:<br> <td>Калиткин</td> </tr> <tr> Телефон :<br> <td>202 55 55</td> </tr> <tr> Телефон:<br> <td>456 77 84</td> </tr> </table><br><br> <h1>Выравнивание содержимого в ячейках таблицы</h1> <html> <body><br> <table width="360" border="1"> <tr> <th align="left">Опубликовано курсов</th> <th align="center">2004</th> <th align="center">2005</th> </tr> <tr> <td align="left">Базы данных</td> <td align="center">2</td> <td align="center">3</td> </tr> <tr> <td align="left">Программирование</td> <td align="center">4</td> <td align="center">5</td> </tr> <tr> <td align="left">Интернет-технологии</td> <td align="right">2</td> <td align="right">3</td> </tr> <tr> <th align="left">всего</th> <th align="right">8</th> <th align="right">11</th> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Заглавие таблицы</h1> <html> <body><br> <h4> Эта таблица имеет заглавие и толстую рамку: </h4><br> <table border="6"> <caption>Заглавие</caption> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Заголовки таблицы:</h1> <table border=1><br> <tr> Имя<br> Телефон<br> Телефон<br> </tr> <tr> <td>Калиткин</td> <td>202 55 55 </td> <td>456 77 84 </td> </tr> </table><br><br> <h1>Заголовки в таблице</h1> <html> <body><br> <h4>Заголовки таблицы:</h4> <table border="1"> <tr> <th>Имя </th> <th>Телефон </th> <th>Телефон </th> </tr> <tr> <td>Калиткин</td> <td>202 55 55 </td> <td>456 77 84 </td> </tr> </table><br> <h4>Вертикальные заголовки:</h4> <table border="1"> <tr> <th>Фамилия:</th> <td>Калиткин</td> </tr> <tr> <th>Телефон :</th> <td>202 55 55</td> </tr> <tr> <th>Телефон:</th> <td>456 77 84</td> </tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1> Основы работы с HTML </h1> <h1>Неупорядоченные списки</h1> Неупорядоченный список является списком элементов. Элементы списка маркируются с помощью специальных знаков (обычно небольшой черный круг).<br>Неупорядоченный список начинается с тега . Каждый элемент списка начинается с тега <li>.<br> <html> <body><br> <h4>Неупорядоченный список:</h4> <li>элемент 1</li> <li>элемент 2</li> <li>элемент 3</li> <br> </body> </html><br> Пример выполнения данного HTML-кода<br>Внутри элемента списка можно помещать параграфы, переносы строк, изображения, ссылки, другие списки, и т.д.<br><br> <h1>Различные типы неупорядоченных списков</h1> <html> <body><br> <h4>Список со значком кругом:</h4> <ul type="disc"> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> <h4>Список со значком окружностью:</h4> <ul type="circle"> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> <h4>Список со значком квадратом:</h4> <ul type="square"> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Различные типы упорядоченных списков</h1> <html> <body><br> <h4>Список проектов с цифрами:</h4> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> <h4>Список с буквами:</h4> <ol type="A"> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> <h4>Список с буквами нижнего регистра:</h4> <ol type="a"> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> <h4>Список с римскими цифрами:</h4> <ol type="I"> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> <h4>Список с римскими цифрами в нижнем регистре:</h4> <ol type="i"> <li>intuit.ru</li> <li>osp.ru</li> <li>file.ru</li> <br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Списки определений</h1> Список определений не является списком элементов. Это список терминов и определений терминов.<br>Список определений начинается с тега <dl>. Каждый термин списка определений начинается с тега <dt>. Каждое определение списка начинается с тега <dd>.<br> <html> <body><br> <dl> <dt>элемент 1</dt> <dd>описание элемента 1</dd> <dt>элемент 2</dt> <dd>описание элемента 2</dd> </dl><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Внутри определения списка определений (тег <dd>) можно помещать параграфы, переносы строк, изображения, ссылки, другие списки, и т.д.<br><br> <h1>Список определений</h1> <html> <body><br> <h4>Список определений:</h4> <dl> <dt>элемент 1</dt> <dd>описание элемента 1</dd> <dt>элемент 2</dt> <dd>описание элемента 2</dd> </dl><br> </body> </html><br> Пример выполнения данного HTML-кода<br> <br> элемент 1<br> описание элемента 1<br> элемент 2<br> описание элемента 2<br><br> <h1>Теги списков</h1> <table border=1><tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">Определяет упорядоченный список</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">Определяет неупорядоченный список</td></tr><tr><td bgcolor="#eaeaea" valign="top"><li></td><td bgcolor="#eaeaea" valign="top">Определяет элемент списка</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dl></td><td bgcolor="#eaeaea" valign="top">Определяет список определений</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dt></td><td bgcolor="#eaeaea" valign="top">Определяет термин определения</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dd></td><td bgcolor="#eaeaea" valign="top">Определяет описание определения</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dir></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого </td></tr><tr><td bgcolor="#eaeaea" valign="top"><menu></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого </td></tr></table><br><br> <h1>Упорядоченные списки</h1> Упорядоченный список также является списком элементов. Элементы списка маркируются с помощью чисел или букв.<br>Упорядоченный список начинается с тега. Каждый элемент списка начинается с тега <li>. У тега может быть два атрибута start (определяет первое число, с которого начинается нумерация пунктов) и type (определяет стиль нумерации пунктов). Может иметь значения:<br><li>"A" - заглавные буквы A, B, C ...</li><li>"a" - строчные буквы a, b, c ...</li><li>"I" - большие римские числа I, II, III ...</li><li>"i" - маленькие римские числа i, ii, iii ...</li><li>"1" - арабские числа 1, 2, 3 ...</li><br> <html> <body><br> <h4>Упорядоченный список:</h4> <li>элемент 1</li> <li>элемент 2</li> <li>элемент 3</li> <br> </body> </html><br> Пример выполнения данного HTML-кода<br>Внутри элемента списка можно помещать параграфы, переносы строк, изображения, ссылки, другие списки, и т.д.<br><br> <h1>Вложенный список</h1> <html> <body><br> <h4>Вложенный список:</h4> <li>элемент 1</li> <li>элемент 2 <li>элемент 2.1</li> <li>элемент 2.2</li> </li> <li>элемент 3</li> <br> </body> </html><br> <html> <body><br> <h4>Вложенный список:</h4> <li>элемент 1</li> <li>элемент 2</li> <li>элемент 2.1</li> <li> элемент 2.2</li> <li>элемент 2.2.1</li> <li>элемент 2.2.2</li> </li> </li> <li>элемент 3</li> <br> </body> </html><br> Пример выполнения данного HTML-кода<br> <br> <li>элемент 1</li><br> <li>элемент 2</li><br> <li>элемент 2.1</li><br> <li> элемент 2.2</li><br> <li>элемент 2.2.1</li><br> <li>элемент 2.2.2</li><br> <li>элемент 3</li><br><br> <h1> Основы работы с HTML </h1> <h1>Флажки</h1> Флажки (type=checkbox) используются, когда необходимо, чтобы пользователь выбрал один или несколько вариантов из ограниченного числа вариантов выбора. Флажки в форме не зависят друг от друга, их можно установить или сбросить в любой комбинации. Для каждого флажка необходимо задать свое уникальное имя при помощи атрибута name. Создание двух флажков с одним именем не вызовет ошибки при отображении формы, но не позволит сценарию обработки на сервере корректно обработать передаваемые с формы данные.<br> <html> <body><br> <form> В этом году я собираюсь приобрести: <br> <input type="checkbox" name="computer"> Компьютер <br> <input type="checkbox" name="notebook"> Ноутбук <br> <input type="checkbox" name="printer"> Принтер <br> <input type="checkbox" name="scanner"> Сканер </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>При помощи атрибута checked можно установить, какие из флажков будут выбраны по умолчанию при загрузке страницы. Отличие от переключателей заключается только в том, что для флажков можно отметить сразу несколько вариантов.<br> <html> <body><br> <form> В этом году я собираюсь приобрести: <br> <input type="checkbox" name="computer" checked="checked"> Компьютер <br> <input type="checkbox" name="notebook"> Ноутбук <br> <input type="checkbox" name="printer"> Принтер <br> <input type="checkbox" name="scanner" checked="checked"> Сканер </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>В данном примере по умолчанию выбраны флажки "Компьютер" и "Сканер":<br>При отправке данных формы с флажками на сервер выбранным флажкам присваивается значение по умолчанию "on". Как правило, этого достаточно для корректной обработки данных, но в некоторых случаях удобнее задать каждому флажку свое значение при помощи атрибута value.<br> <input type="checkbox" name="printer" value="Принтер"><br><br> <h1>Форма поиска</h1> Одна из наиболее распространенных форм. Пользователь получает возможность ввести искомый запрос, определить область поиска и отправить запрос на сервер для обработки.<br> <html> <body><br> <form name="input" action="html_form_action.asp" method="get"> <table border=1 bgcolor="#ddffdd"> <tr> <td align="center"> <input type="text" name="search" size="50" value="Строка для поиска"> <input type="submit" value="Поиск"> <br> <input type="checkbox" name="news">Искать в новостях <input type="checkbox" name="arhive">Искать в архивах </td> </tr> </table> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Формы</h1> Форма является областью, которая может содержать элементы, позволяющие. пользователю вводить информацию (такие как текстовые поля, поля многострочного текста, раскрывающиеся меню, переключатели, флажки, и т.д.).<br>Форма определяется с помощью тегов <form></form>, между которыми располагаются поля ввода, кнопки, а также все необходимые элементы оформления формы.<br>Тег <form> имеет ряд атрибутов, из которых необходимо выделить атрибуты action и method. Без этих атрибутов форма не сможет передать информацию от пользователя на сервер.<br> <form action="html_form_action.asp" method=get><br> Атрибут Action указывает URL-адрес объекта, который должен получить данные формы.<br>Атрибут method может иметь два значения: get и post.<br>Значение атрибута method=get заставляет Web-браузер передать все данные формуляра по URL-адресу, заданному в action. При этом введенные при заполнении формы данные просто добавляются в адресную строку с использованием разделителя – знака вопроса. Этот метод удобен для небольших форм.<br>Значение атрибута method=post заставляет Web-браузер, прежде всего, связаться с сервером, обрабатывающим форму, и только после установки связи приступить к передаче данных, для обработки которых будут использоваться специальные сценарии.<br><br> <h1>Группировка полей формы</h1> Теги <fieldset> </fieldset> объединяют поля формы в группы, выделяют их визуально, упрощают навигацию в форме с помощью клавиши [Tab] (в первую очередь обходятся поля в пределах группы). Для того чтобы объединить несколько элементов ввода или управления в группу достаточно поместить их внутри тегов <fieldset> </fieldset>. Закрывающий тег </fieldset> обязателен.<br>В следующем примере создается форма, содержащая поля для ввода имени и фамилии, объединенные в группу, а также кнопку отправки<br> <html> <body><br> <form name="input" action="html_form_action.asp" method="get"> <fieldset> Имя: <input type="text" name="firstname" value="Билл"> <br> Фамилия: <input type="text" name="lastname" value="Гейтс"> </fieldset> <input type="submit" value="отправить"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>При помощи пары тегов <legend> </legend> образованной группе полей можно присвоить имя. В следующем примере форма ввода дополнена полями для ввода информации о месте работы и занимаемой должности, объединенными во вторую группу. Каждой группе полей присвоен свой заголовок.<br> <html> <body><br> <form name="input" action="html_form_action.asp" method="get"> <fieldset> <legend>Личные данные</legend> Имя: <input type="text" name="firstname" value="Билл"> <br> Фамилия: <input type="text" name="lastname" value="Гейтс"> <br> Пол: <input type="radio" name="Sex" value="Male" checked="checked"> Мужской <input type="radio" name="Sex" value="Female"> Женский </fieldset> <fieldset> <legend>Данные о работе</legend> Место работы: <input type="text" name="work" value="Microsoft"> <br> Должность: <input type="text" name="status" value="Президент"> </fieldset><br> <input type="submit" value="отправить"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Командные кнопки</h1> Командная кнопка отправки (type=submit) используются для выполнения пересылки данных формы на сервер. Метод отправки и адрес файла, обрабатывающего полученную информацию задаются в теге <form> при помощи атрибутов method и action. Командная кнопка сброса (type=reset) возвращает форму к исходному состоянию (очищает форму). При этом данные не передаются.<br>В следующем примере показана форма поиска с двумя кнопками отправки и сброса.<br> <html> <body><br> <form name="input" action="html_form_action.asp" method="get"> Найти: <input type="text" name="search" size=25> <br> <input type="submit"> <input type="reset"><br> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Если ввести в текстовое поле какие-то символы и нажать кнопку "Подача запроса", то введенная информация будет послана на страницу с именем "html_form_action.asp". При нажатии на кнопку "Сброс" текстовое поле очистится.<br>Надписи на кнопках "Подача запроса" и "Сброс" установлены по умолчанию. Для их изменения необходимо использовать атрибут value.<br>Кроме кнопок отправки и сброса существует также возможность добавлять пользовательские кнопки (type=button), которые могут использоваться для выполнения процедур (скриптов) непосредственно на Web-странице.<br><br> <h1>Оформление форм стандартными средствами HTML</h1> Несмотря на простоту использования тегов группировки <fieldset>, их возможности по оформлению форм весьма ограничены. Чаще всего для оформления внешнего вида форм используются стандартные средства HTML. В следующем примере показано, как с помощью таблицы поля формы выровнены друг под другом, а заголовок формы и кнопка отправки размещены по центру формы. Сама форма визуально выделена желтым цветом.<br> <html> <body><br> <form name="input" action="html_form_action.asp" method="get"> <table bgcolor="#FFFF99"> <tr> <th colspan="2" align="center">Личные данные:</td> </tr> <tr> <td align="right">Имя:</td> <td align="left"><input type="text" name="firstname" value="Билл"></td> </tr> <tr> <td align="right">Фамилия:</td> <td align="left"><input type="text" name="lastname" value="Гейтс"></td> </tr> <tr> <td colspan="2" align="center"><input type="submit" value="отправить"></td> </tr> </table> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Отправка e-mail из формы</h1> Вторая форма представляет собой форму заказа электронной рассылки ИНТУИТА, заполненная форма, отправляется по электронной почте для последующей обработки.<br> <html> <body><br> <form action="MAILTO:info@intuit.ru" method="post" enctype="text/plain"> <h3>Подписка на новостную рассылку ИНТУИТ</h3> Имя:<br> <input type="text" name="name" value="ваше имя" size="20"> <br> Mail:<br> <input type="text" name="mail" value="ваш е-mail" size="20"> <br> Я хочу получать: <br> <input type="checkbox" name="news"> Новости о жизни ИНТУИТА <br> <input type="checkbox" name="courses"> Информацию о новых курсах <br> <input type="checkbox" name="books"> Информацию о новых изданиях <br> Комментарий:<br> <textarea rows="5" cols="30"> </textarea> <hr> <input type="submit" value="Послать"> <input type="reset" value="Сброс"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Переключатели</h1> Переключатели или радиокнопки (type=radio) определяют поля выбора одного значения из нескольких доступных. Поля этого типа часто используются в диалоговых окнах. Для каждой позиции переключателя создается свой тег <input type=radio>. Группируются переключатели при помощи одинакового имени, задаваемого атрибутом name.<br> <html> <body<br> <form> Укажите Ваш пол: <br> <input type="radio" name="sex" value="male"> мужчина <br> <input type="radio" name="sex" value="female"> женщина </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Необходимо отметить, что в отличие от текстового поля и поля пароля атрибут value задает значение, которое будет передано серверу для дальнейшей обработки в случае выбора данного переключателя. Для выбора по умолчанию одного из возможных значений группы переключателей используется атрибут checked.<br> <html> <body><br> <form> Укажите Ваш пол: <br> <input type="radio" name="sex" value="male" checked="checked"> мужчина <br> <input type="radio" name="sex" value="female"> женщина </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>В данном примере по умолчанию выбран мужской пол:<br><br> <h1>Подписка на новостную рассылку ИНТУИТ</h1> Имя:<br><br> Mail:<br><br> Я хочу получать: <br><br> Новости о жизни ИНТУИТА <br><br> Информацию о новых курсах <br><br> Информацию о новых изданиях <br><br> Комментарий:<br><br> <h1>Поле пароля</h1> Поле пароля (type=password) создает защищенное поле ввода, которое дает возможность пользователю, заполняющему форму ввести текст, но в отличие от обычного текстового поля, вводимые данные при отображении на мониторе заменяются звездочками или точками.<br>Следующий пример демонстрирует простейшую форму для ввода имени пользователя и пароля.<br> <html> <body><br> <form> Имя пользователя: <input type="text" name="user" value="Елена"> <br> Пароль: <input type="password" name="password" value="tktyf"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Необходимо обратить внимание, что хотя значение пароля и задано по умолчанию, при отображении браузер выводит вместо символов звездочки.<br><br> <h1>Поле выбора файла</h1> Поле выбора файла (type=file) создает поле для выбора файла, который будет загружен на сервер вместе с информацией формы. Рядом с полем ввода отображается командная кнопка "Обзор…", открывающая стандартное диалоговое окно выбора файла.<br> <html> <body><br> <form> Прикрепить файл: <br> <input type="file" size="50"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Для поля выбора файла по аналогии с текстовым полем можно использовать атрибуты size, maxlength, value.<br><br> <h1>Поля ввода</h1> Большинство элементов ввода и управления в форме можно описать при помощи тега <input>, обязательными для которого являются атрибуты name (приписывает данному элементу ввода уникальное имя, использующееся для дальнейшей обработки формы) и type (определяет тип элемента управления или ввода).<br><br> <h1>Раскрывающийся список выбора</h1> Раскрывающиеся списки выбора по своему назначению соответствуют переключателем, в то же время их использование предпочтительно в тех случаях, когда количество вариантов выбора достаточно велико. Как правило, при выборе более чем из трех вариантов желательно вместо переключателей использовать раскрывающиеся списки.<br>В следующем примере создан простой раскрывающийся список выбора ноутбука по производителю.<br> <html> <body><br> <form> Выбор ноутбука по производителю: <select name="notebook"> <option value="acer">Acer <option value="asus">Asus <option value="compaq">Compaq <option value="hp">HP <option value="sony">Sony <option value="toshiba">Toshiba </select> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Необходимо заметить, что по умолчанию выбирается первое значение из списка. При помощи атрибута selected тега <option> это значение можно изменить. Следующий пример показывает раскрывающийся список выбора размера экрана ноутбука с предварительно установленным значением "15.4".<br> <html> <body><br> <form> Выбор размера экрана ноутбука <select name="tft"> <option value="tft-12">12" <option value="tft-13">13" <option value="tft-14">14" <option value="tft-15">15" <option value="tft-15-4" selected="selected">15.4" <option value="tft-17">17" </select> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Развернутый список выбора</h1> Развернутые списки используются, как правило, при необходимости множественного выбора значений. В следующем примере раскрывающийся список выбора ноутбука по производителю преобразован в развернутый список с возможностью множественного выбора.<br> <html> <body><br> <form> Выбор ноутбука по производителю: <select name="notebook" multiple> <option value="aser">Aser <option value="asus">Asus <option value="compaq">Compaq <option value="hp">HP <option value="sony">Sony <option value="toshiba">Toshiba </select> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Необходимо отметить, что для списков с множественным выбором значение атрибута size по умолчанию устанавливается равным 4, кроме того, ни одно из значений не является выбранным по умолчанию. В следующем примере показана форма с развернутым списком высотой в 6 пунктов с предварительно заданными значениями "Compaq" и "Sony".<br> <html> <body><br> <form> Выбор ноутбука по производителю: <select name="notebook" multiple size=6> <option value="aser">Aser <option value="asus">Asus <option value="compaq" selected="selected">Compaq <option value="hp">HP <option value="sony" selected="selected">Sony <option value="toshiba">Toshiba </select> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Регистрация нового пользователя</h1> </body> </html><br> <html> <body><br> <form name="input" action="html_form_action.asp" method="post"> <table bgcolor="#dddddd"> <tr> <th colspan="2" align="center">Регистрация нового пользователя</th> </tr> <tr> <td colspan="2" align="center">Обязательные поля выделены красным цветом<br><br></td> </tr> <tr> <td align="right"><font color="red">Ник (псевдоним):</td> <td align="left"><input type="text" name="nik" size="27"></td> </tr> <tr> <td align="right"><font color="red">E-mail</td> <td align="left"><input type="text" name="e_mail" size="27"></td> </tr> <tr> <td align="right"><font color="red">Пароль (не менее 6 сим.):</td> <td align="left"><input type="password" name="password" size="27"></td> </tr> <tr> <td align="right"><font color="red">Подтвердите пароль:</td> <td align="left"><input type="password" name="f_password" size="27"></td> </tr> <tr> <td colspan="2"><hr></td> </tr> <tr> <td align="right">Фамилия</td> <td align="left"><input type="text" name="name_f" size="27"></td> </tr> <tr> <td align="right">Имя</td> <td align="left"><input type="text" name="name_i" size="27"></td> </tr> <tr> <td align="right">Отчество</td> <td align="left"><input type="text" name="name_o" size="27"></td> </tr> <tr> <td align="right">Дата рождения:</td> <td align="left"> <select name="day"> <option>1 <option>2 <option>3 <option>4 <option>5 <option>6 <option>7 <option>8 <option>9 <option>10 <option>11 <option>12 <option>13 <option>14 <option>15 <option>16 <option>17 <option>18 <option>19 <option>20 <option>21 <option>22 <option>23 <option>24 <option>25 <option>26 <option>27 <option>28 <option>29 <option>30 <option>31 </select> <select name="month"> <option>января <option>февраля <option>марта <option>апреля <option>мая <option>июня <option>июля <option>августа <option>сентября <option>октября <option>ноября <option>декабря </select> <select name="year"> <option>1980 <option>1981 <option>1982 <option>1983 <option>1984 <option>1985 <option>1986 <option>1987 <option>1988 <option>1989 <option>1990 </select> </td> </tr> <tr> <td align="right">Пол:</td> <td align="left"> <input type="radio" name="sex" value="male">Мужской <input type="radio" name="sex" value="female">Женский </td> </tr> <tr> <td align="right">Город проживания:</td> <td align="left"><input type="text" name="state" size="27"></td> </tr> <tr> <td align="right" valign="top">Образование:</td> <td align="left"> <input type="radio" name="edu" value="h">Высшее<br> <input type="radio" name="edu" value="hh">Незаконченное высшее<br> <input type="radio" name="edu" value="ss">Среднее специальное<br> <input type="radio" name="edu" value="s">Среднее </td> </tr> <tr> <td colspan="2"><hr></td> </tr> <tr> <td colspan="2" align="center"> <input type="submit" value="Зарегистрироваться"> <input type="reset" value="Очистить форму"> </td> </tr> </table> </form><br> <br> </body> </html><br><br> Пример выполнения данного HTML-кода<br><br> В данном примере представлена форма регистрации нового пользователя. Отличительной особенностью данной формы является организация ввода даты рождения, построенная с использованием трех выпадающих списков. Хотя реализация такого ввода дат на первый взгляд более трудоемка в процессе создания Web-страницы (для сравнения, в предыдущем примере для организации поля ввода даты потребовалась всего одна строка), но она оправдывает себя за счет сведения к минимуму ошибок при вводе информации. Такая схема организации ввода широко используется при вводе и других данных, таких как, например, страна и город проживания (в данном примере не реализовано).<br><br>Следует обратить внимание и на присутствие в форме двух групп переключателей, которые отвечают за ввод пола и образования пользователя.<br><br><table border=1>Теги форм<tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top"><form></td><td bgcolor="#eaeaea" valign="top">Определяет форму для ввода пользователя</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top"><input></td><td bgcolor="#eaeaea" valign="top">Определяет поле ввода </td></tr><tr><td bgcolor="#eaeaea" valign="top"><textarea></td><td bgcolor="#eaeaea" valign="top">Определяет текстовую область (элемент управления для ввода многострочного текста)</td></tr><tr><td bgcolor="#eaeaea" valign="top"><label></td><td bgcolor="#eaeaea" valign="top">Определяет метку для элемента управления</td></tr><tr><td bgcolor="#eaeaea" valign="top"><fieldset></td><td bgcolor="#eaeaea" valign="top">Определяет набор полей</td></tr><tr><td bgcolor="#eaeaea" valign="top"><legend></td><td bgcolor="#eaeaea" valign="top">Определяет заглавие для набора полей</td></tr><tr><td bgcolor="#eaeaea" valign="top"><select></td><td bgcolor="#eaeaea" valign="top">Определяет список выбора (раскрывающееся поле)</td></tr><tr><td bgcolor="#eaeaea" valign="top"><optgroup></td><td bgcolor="#eaeaea" valign="top">Определяет группу вариантов выбора</td></tr><tr><td bgcolor="#eaeaea" valign="top"><option></td><td bgcolor="#eaeaea" valign="top">Определяет вариант в раскрывающемся поле</td></tr><tr><td bgcolor="#eaeaea" valign="top"><button></td><td bgcolor="#eaeaea" valign="top">Определяет кнопку</td></tr><tr><td bgcolor="#eaeaea" valign="top"><isindex></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого <input></td></tr></table><br> <h1>Регистрация в системе</h1> <html> <body><br> <form name="input" action="html_form_action.asp" method="post"> <table bgcolor="#9999FF"> <tr> <th colspan="2" align="center">Регистрация в системе</td> </tr> <tr> <td align="right">Имя:</td> <td align="left"><input type="text" name="name"></td> </tr> <tr> <td align="right">Пароль:</td> <td align="left"><input type="password" name="password"></td> </tr> <tr> <td colspan="2" align="center"><input type="checkbox">Запомнить пароль</td> </tr> <tr> <td colspan="2" align="center"><input type="submit" value="Вход"></td> </tr> </table> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>В этом примере представлена типовая форма входа в систему авторизированного пользователя. Форма состоит из поля ввода имени, поля ввода пароля, флажка сохранения пароля и кнопки входа. <br>Необходимо отметить, что при работе с паролями следует использовать только метод post. При использовании метода get пароль будет передаваться для обработки в открытом виде. Для проверки этого достаточно в данном примере заменить метод post на get, запустить пример, заполнить поля (например, имя пользователя: Bill, пароль superstar) и нажать кнопку "Вход". В этом случае в адресной строке браузера появиться адрес: {ваш рабочий каталог}/html_form_action.asp?name=Bill&password=superstar.<br>Примечание: необходимо, чтобы в Вашем рабочем каталоге находился файл с именем "html_form_action.asp" (это может быть даже пустой файл).<br><br> <h1>Списки выбора</h1> Списки выбора бывают двух типов: раскрывающиеся списки (выпадающие меню) и списки с множественным выбором. Независимо от типов списков описываются они одинаково с помощью пары тегов <select> </select>. Отдельные элементы списка задаются с использованием тега <option>. Тип списка определяется при помощи атрибутов тега <select>.<br>Атрибут name задает имя поля для отправки выбранных пунктов списка на сервер. Атрибут multiple разрешает множественный выбор. Атрибут size определяет, какое количество пунктов списка будет одновременно отображено на экране. При этом, если атрибут multiple не задан и size=1, то на экране отображается раскрывающийся список, если же задан атрибут Multiple или значение size больше 1, то список отображается развернутым.<br><br> <h1>Текстовая область</h1> В отличие от текстового поля <input type=text> текстовая область позволяет вводить многострочный текст большого объема. Такие области часто используются при вводе сообщений, комментариев.<br>Текстовое поле описывается при помощи тегов <textarea> </textarea>, между которыми можно разместить предварительно отформатированный стандартный текст. Атрибуты cols и rows задают размер видимой области текстового поля.<br>В следующем примере создано текстовое поле с предварительно введенным текстом.<br> <html> <body><br> <textarea rows="7" cols="30"> В данном примере мы создали текстовую область с шириной в 30 символов и высотой в 7 строк. Заданное значение высоты не ограничивает общий объем вводимого текста, а влияет только на размер отображаемой на экране текстовой области. Для просмотра всего текста необходимо воспользоваться полосой прокрутки. </textarea><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Текстовые поля</h1> Текстовое поле (type=text) определяет однострочное поле ввода и используется, когда необходимо, чтобы пользователь ввел в форму данные в произвольной форме но ограниченные по объему (слова, словосочетания, числа и т.д.).Следующий пример демонстрирует простейшую форму для ввода имени и фамилии.<br> <html> <body><br> <form> Имя: <input type="text" name="firstname"> <br> Фамилия: <input type="text" name="lastname"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>В большинстве браузеров по умолчанию ширина текстового поля равна 20 символам. Для изменения этого значения используется атрибут size. В следующем примере поле для ввода имени ограничено 10 символами.<br> <html> <body><br> <form> Имя: <input type="text" name="firstname" size="10"> <br> Фамилия: <input type="text" name="lastname"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Здесь необходимо отметить, что атрибут size ограничивает только видимую область ввода данных, а не длину вводимой строки. Для этой цели используется атрибут maxlength. В следующем примере максимальное количество символов для ввода имени ограничено тремя.<br> <html> <body><br> <form> Имя: <input type="text" name="firstname" maxlength="3"> <br> Фамилия: <input type="text" name="lastname"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>При вводе в поле имени слова "Елена" форма воспримет только первые три символа имени:<br>Кроме того, при использовании текстовых полей возможно задать значения по умолчанию. Для этого используется атрибут value. Применение этого атрибута показано на следующем примере:<br> <html> <body><br> <form> Имя: <input type="text" name="firstname" value="Билл"> <br> Фамилия: <input type="text" name="lastname" value="Гейтс"> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Необходимо отметить, что применение атрибутов для различных типов полей вывода и управления может отличаться. Так, например, атрибут size для текстовых полей ввода (type="text" или type="password") указывает максимальное количество символов, отображаемых в поле, а для прочих элементов – занимаемый по горизонтали размер в пикселях.<br><br> <h1>Внешний вид форм</h1> Существует различные способы оформления внешнего вида форм. Один из них основан на использовании пары тегов <fieldset> </fieldset>, которые позволяют объединить тематически близкие и рядом расположенные поля формы в группу и выделить ее визуально. Другой способ основан на применении стандартных средств форматирования HTML, включая цветовое и шрифтовое оформление, графику, таблицы и т.п.<br><br> <h1>Запрос документа</h1> <html> <body><br> <form action="MAILTO:info@intuit.ru" method="post" enctype="text/plain"><br> <form name="input" action="html_form_action.asp" method="get"> <table bgcolor="#dddddd"> <tr> <th colspan="2" align="center">Запрос документа</td> </tr> <tr> <td align="right">Тип документа:</td> <td align="left"> <select name="do_type"> <option value="mail">Письмо <option value="order">Приказ <option value="message">Служебная записка </select> </td> </tr> <tr> <td align="right">Дата регистрации с</td> <td align="left"><input type="text" name="date_begin" size="21" value="дд.мм.гггг"></td> </tr> <tr> <td align="right">по</td> <td align="left"><input type="text" name="date_end" size="21" value="дд.мм.гггг"></td> </tr> <tr> <td align="right">Регистрационный номер:</td> <td align="left"><input type="text" name="number" size="21"></td> </tr> <tr> <td colspan="2"><hr></td> </tr> <tr> <td align="right" valign="top">Ключевые слова:</td> <td align="left"> <textarea cols="17" rows="5"> </textarea> </td> </tr> <tr> <td colspan="2"><hr></td> </tr> <tr> <td colspan="2" align="center"> <input type="submit" value="Отправить"> <input type="reset"> </td> </tr> </table> </form><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Особенностью данной формы является то, что введенные данные отправляются на указанный адрес электронной почты. В остальном, это достаточно типовая форма, содержащая поля ввода текста, текстовую область и выпадающий список. Для пояснения формата ввода в полях даты регистрации по умолчанию показан образец заполнения. Но при этом необходимо отметить, что форма не проверяет корректность введенной информации.<br><br> <h1> Основы работы с HTML </h1> <h1>Атрибут Alt</h1> В ряде случаев графическое изображение на Web-странице не может быть отражено. Это может происходить при просмотре страниц с использованием текстовых браузеров, при запрете на отображение графики в целях увеличения скорости загрузки и снижения расходов на Интернет, а также в ряде других случаев. При этом смысл страницы может быть существенно искажен, а при использовании графических меню и кнопок навигация по сайту будет значительна затруднена. Во избежание этого в HTML используется атрибут alt, который задает цепочку символов (максимальная длина 1024 символа), отображаемую в браузере вместо изображения и в произвольной форме описывающую его (заменяющий текст).<br>Следующий пример демонстрирует синтаксис применения атрибута alt.<br> <html> <body><br> <img src="logo.gif" width="285" height="52" alt="Логотип Интуита"> <br> Для демонстрации работы атрибута alt необходимо в свойствах обозревателя запретить использование графики на странице. <br> Обратите внимание, что даже при отображенной графике замещающий текст появляется на экране при наведении указателя мыши на изображение. Благодаря этому атрибут alt можно использовать и в качестве своеобразной подписи к рисунку.<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Использование атрибута alt считается признаком хорошего HTML-тона, так как это позволяет улучшить вывод и полезность документа для людей, который используют браузеры только для вывода текста. Кроме того, использование атрибута ALT можно считать обязательным для графических ссылок. В следующем примере приведен фрагмент графического меню. В примере специально даются ссылки на несуществующие графические файлы (отпадает необходимость запрета на отображение рисунков браузером для понимания работы примера).<br> <html> <body><br> В первом варианте атрибут alt не используется, пользователь видит перед собой три прямоугольника, о назначении которых он может только догадываться. <hr> <img src="home.gif" width="80" height="30"> <img src="mail.gif" width="80" height="30"> <img src="map.gif" width="80" height="30"> <hr> <br> Использование атрибута alt во втором варианте позволяет эффективно использовать ссылки меню и в отсутствие изображений. <hr> <img src="home.gif" width="80" height="30" alt="На главную страницу"> <img src="mail.gif" width="80" height="30" alt="Отправить письмо"> <img src="map.gif" width="80" height="30" alt="Карта сайта"><br> <hr><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Основы работы с HTML</h1> Формат GIF был разработан коммерческой Online-службой CompuServe для передачи графики по сети между различными платформами. GIF поддерживает до 256 цветов, что является существенным ограничением формата. GIF практически непригоден для передачи фотографических изображений.<br>В то же время формат GIF обладает рядом свойств, определивших его широкое применение при разработке Web-страниц:<br><li>Прозрачность. Изображения в формате GIF могут иметь прозрачные области, что позволяет отойти от стандартных прямоугольных форм и создавать элементы страницы произвольной формы.</li><li>Чередование строк. Графический файл может быть записан таким образом, что при отображении сначала будет загружаться каждая четвертая строка, растянутая на три соседних. Естественно, качество отображения будет достаточно низкое. Затем, по мере загрузки последующих строк, изображение примет окончательный вид. Такая схема позволяет пользователю еще до окончательной загрузки графического файла понять, что именно представлено на изображении.</li><li>Анимация. Форматом GIF предусмотрена возможность создания анимированных изображений. Фактически это несколько изображений, записанных в один файл и чередующихся с заданным интервалом времени.</li><br> Область применения GIF-файлов ограничивается и применяемым алгоритмом сжатия изображений, чья эффективность зависит от разнообразия цветов в изображении, наличия одноцветных областей. Наибольшую экономию объема файла дают изображения с небольшим количеством цветов и большими одноцветными областями. Поэтому формат GIF широко используется для отображения графических меню и кнопок, а также для создания технических иллюстраций (графики, схемы, диаграммы и т.п.). В то же время использование формата GIF для отображения полноцветных фотографий практически не находит применения по причине малого количества передаваемых цветов и низкой эффективности алгоритма сжатия для таких изображений.<br><br> <h1>Графические форматы</h1> Изначально HTML поддерживал работу с двумя графическими форматами: GIF и JPEG, в последнее время все большее распространения находит формат PNG. Каждый из форматов имеет свои достоинства и недостатки, которые определяют область его применения.<br><br> <h1>Изменение размера изображения</h1> По умолчанию изображение отображается в браузере с сохранением своих исходных размеров и пропорций. При этом, если изображение превышает размер окна браузера, то оно может либо автоматически уменьшится до размера окна, либо предоставить возможность просмотра по частям с использованием полос прокрутки.<br>При помощи атрибутов height и width (высота и ширина, соответственно) можно задать размеры отображения графического файла на Web-странице.<br> <html> <body><br> В первом случае изображение выводится с сохранением своих исходных размеров (253*190 пикселей). <br> <img src="photo.png"> <br> Во втором варианте высота изображения уменьшена до 100 пикселей. Обратите внимание, хотя явно задан только атрибут height, браузер автоматически отмасштабировал изображение и по ширине с сохранением исходных пропорций. <br> <img src="photo.png" height="100"> <br> В третьем варианте принудительно заданы оба атрибута, при этом высота уменьшена до 100 пикселей, а ширина оставлена на прежнем уровне. В этом случае автоматического масштабирования не производится, и изображение сжимается по вертикали. <br> <img src="photo.png" height="100" width="253"><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Автоматическое масштабирование с заданием только одного из атрибутов довольно часто используется при необходимости вывода изображений различного формата в столбец (при этом для всех изображений задается одинаковым атрибут width) или в строку друг за другом (height).<br>Значение атрибутов height и width задается не только в пикселях, но и в процентах. Но в этом случае речь идет о выделенной под размещение изображения области. Это может быть все окно браузера или ячейка таблицы.<br> <html> <body><br> Ширина изображения в данном примере задана равной 100%. Изменяя размер окна браузера можно заметить, как изображение автоматически масштабируется, занимая всю ширину окна. <br> <img src="photo.png" width="100%"> <br><br> <br> </body> </html><br><br> Пример выполнения данного HTML-кода<br><br> Необходимо отметить, что при задании значений атрибутов height и width в процентах используется тот же принцип масштабируемости, что и для значений в пикселях. При задании одного атрибута значение второго автоматически пересчитывается исходя из сохранения пропорции. При задании значений обоих атрибутов условие сохранения пропорций не соблюдается.<br><br>При размещении изображений на Web-странице желательно придерживаться следующих рекомендации:<br><br><li>При размещении изображения на Web-странице независимо от исходного размера изображения желательно в явном виде задавать размеры области для отображения при помощи атрибутов height и width. В этом случае браузер еще до полной загрузки изображения получает информацию о его размерах и заранее резервирует место, благодаря чему весь текст на странице может быть размещен и отформатирован еще до загрузки изображений. </li><li>Желательно избегать предлагаемых браузерами возможностей масштабирования изображения (за исключением изображений заднего плана) и отображать полноразмерную графику. Для этого изображения должны быть соответствующим образом обработаны при помощи специальных графических пакетов (например, Adobe Photoshop). Это позволяет избегать искажений изображения вследствие масштабирования, уменьшает объем загружаемой информации при использовании изображения большего размера. </li><li>При необходимости размещения на Web-странице изображений большого размера (фотографии, сложные схемы, репродукции картин и т.п.) на первой странице желательно размещать уменьшенные копии изображений, при нажатии на которые будет показываться полноразмерное изображение. В этом случае необходимо использовать два различных варианта этого изображения: полноразмерное и изображение-иконку.</li><br><br> Можно пояснить эти рекомендации на следующем примере.<br><br> <html> <body><br><br> В первом варианте в качестве изображения-иконки используется большое изображение, размер которого изменен при помощи атрибутов width и height. При нажатии на него исходная фотография будет отображена в полный размер. <br> <a href="photo_big.png"><img src="photo_big.png" width="80" height="60" border="0"></a> <br> Во втором варианте в качестве изображения-иконки используется специально подготовленное малое изображение, значения атрибутов width и height заданы для обеспечения правильного форматирования Web-страницы на этапе частичной загрузки. <br> <a href="photo_big.png"><img src="photo_small.png" width="80" height="60" border="0"></a> <br> Несмотря на то, что оба этих варианта с внешней точки зрения практически идентичны, во втором варианте объем загружаемой информации значительно ниже. Так объем большого изображения "photo_big.png" составляет более 1 Мб, в то время как "photo_small.png" - только 14 Кб. <br> Очевидно, что при малой скорости подключения в Интернет пользователь может просто не дождаться конца загрузки страницы.<br><br></body> </html><br><br> Пример выполнения данного HTML-кода<br><br> <h1>JPEG – Joint Photographic Experts Group</h1> Формат JPEG был разработан для передачи фотографий между различными платформами. Благодаря поддержке 24-битовой цветовой палитры (миллионы цветов) формат JPEG получил широкое распространение для отображения иллюстраций высокого качества. При этом применяемый в JPEG алгоритм сжатия позволяет варьировать размер загружаемого файла в зависимости от требуемого качества отображения иллюстрации.<br>Кроме того, формат JPEG поддерживает опцию прогрессивный JPEG, которая во многом похожа со свойством чередования строк формата GIF, но реализована на совершенно других принципах. В файл JPEG записывается несколько иллюстраций полного размера, но различного уровня качества. Сначала отображается рисунок низкого качества (и, соответственно, малого объема), затем догружаются все более качественные изображения. При этом общий объем загружаемого файла возрастает несущественно по сравнению с оригинальным JPEG.<br><br> <h1>Карты изображений, обрабатываемые браузером</h1> Автономные (обрабатываемые браузером) карты изображений описываются с помощью атрибута usemap тега <img>:<br> <img src="figure_1.png" usemap="#coordinates"><br> Где "figure_1.png" - имя файла, содержащего изображение, "#coordinates" - ссылка на часть HTML-документа, описывающего координатные области.<br>Координатные области карты изображений определяются при помощи тегов <map> и <area>.<br>Тег <area> описывает координаты отдельной области изображения, параметры которой и адрес гиперссылки задаются при помощи атрибутов shape, coords и href.<br>Атрибут shape определяет форму области-ссылки. По умолчанию ему присваивается значение shape="rect" - прямоугольник. Также область может быть описана в форме окружности (shape="circle") или многоугольника (shape="poly").<br>Атрибут coords определяет размеры области. В зависимости от типа размечаемой области может меняться значение этого атрибута. Так для shape="rect" указываются две пары координат (левого верхнего и правого нижнего угла прямоугольника) в пикселях. Для shape="circle" указываются координаты центра окружности и ее радиус, а для shape="poly" последовательно указываются координаты вершин многоугольника.<br>Атрибут href задает URL-адрес ссылки для перехода в случае щелчка мышью на выбранной области.<br>Заданные при помощи тегов <area> координатные области изображения ограничиваются при помощи тегов <map>-</map>.<br>В следующем примере задана карта изображений, на которой в соответствии с изображением выделены прямоугольная, круглая и треугольная координатная области.<br> <html> <body> <img src="figure_1.png" width="297" height="210" border="0" alt="Карта изображений" usemap="#coordinates"> <map name="coordinates"> <area coords="130,194,270,130" href="rect.html" alt="Прямоугольник"> <area shape="circle" coords="73,90,40" href="circle.html" alt="Круг"> <area shape="poly" coords="168,109,280,109,223,13" href="polygon.html" alt="Полигон (треугольник)"> </map> </body> </html><br> <br> Пример выполнения данного HTML-кода<br><br> Для корректной работы следующего примера необходимо создать в рабочей папке файлы rect.html, circle.html, polygon.html. Например, файл rect.html:<br><br> <html> <body> Вы выбрали прямоугольник </body> </html><br><br> Обратите внимание, что атрибут alt (заменяющий текст) может использоваться как для всего изображения, так и для каждой его области.<br><br>В следующем примере координатные области пересекаются, обратите внимание, что для карт изображений действует принцип, согласно которому при пересечении двух или более координатных областей активной будет область, описанная первой. В данном примере есть определенное несоответствие, при щелчке мышью на окружности в области пересечения ее с прямоугольником загрузиться файл rect.html.<br><br> <html> <body> <img src="figure_2.png" width="297" height="210" border="0" usemap="#coordinates"> <map name="coordinates"> <area coords="84,173,224,109" href="rect.html" alt="Прямоугольник"> <area shape="circle" coords="130,110,40" href="circle.html" alt="Круг"> <area shape="poly" coords="105,138,217,138,161,42" href="polygon.html" alt="Полигон (треугольник)"> </map> </body> </html><br><br> Пример выполнения данного HTML-кода<br><br>В следующем примере порядок описания координатных областей приведен в соответствие с изображением на экране.<br><br> <html> <body> <img src="figure_2.png" width="297" height="210" border="0" usemap="#coordinates"> <map name="coordinates"> <area shape="circle" coords="130,110,40" href="circle.html" alt="Круг"> <area shape="poly" coords="105,138,217,138,161,42" href="polygon.html" alt="Полигон (треугольник)"> <area coords="84,173,224,109" href="rect.html" alt="Прямоугольник"> </map> </body> </html><br><br>Пример выполнения данного HTML-кода<br><br> <h1>Карты изображений, обрабатываемые на сервере</h1> Карты изображений, обрабатываемые на сервере описываются с помощью атрибута ismap тега <img>, располагающегося между тегами <a> - </a>, например:<br> <a href="tryhtml_ismap.htm"> <img src="figure_1.png" ismap> </a><br> Где "tryhtml_ismap.htm" – файл на сервере, описывающий координатные области изображения.<br>При использовании серверной обработки карт изображений на сервер передаются координаты курсора относительно изображения. В следующем примере при перемещении курсора по поверхности изображения в строке состояния вместе с именем файла обработчика отображаются координаты курсора.<br> <html> <body> <a href="tryhtml_ismap.htm"> <img src="figure_1.png" width="297" height="210" border="0" alt="Карта изображений" ismap> </a> </body> </html><br> Пример выполнения данного HTML-кода<br>Работая с картами изображений необходимо помнить, что при отключении отображения графики (например, при плохих каналах связи) работа с ними практически невозможна. При помощи атрибутов alt можно задать имена выделенным областям, но ориентироваться по такой карте изображений будет достаточно затруднено, поэтому необходимо использовать карты изображения только в тех случаях, когда их присутствие целесообразно, например, в географических справочных системах, учебных системах, где необходима наглядность, и т.п. В этом случае признаком хорошего тона считается создание текстового меню, дублирующего ссылки на карте изображении.<br><br> <h1>Карты изображений</h1> Наряду с использованием изображений в качестве иллюстраций к тексту или элементов оформления Web-страницы, в HTML предусмотрена возможность создания карт изображений (imagemap), отдельные области которого могут являться гиперссылками на другие разделы или страницы Web-сайта. В общем виде это соответствует использованию изображения в качестве гиперссылки с тем отличием, что на одной карте изображений можно создать несколько несовпадающих областей, и соответственно, гиперссылок.<br>Применение таких карт изображений удобно для создания географических справочных систем, путеводителей, карт погоды. Также карты изображений находят широкое применение при создании сложных графических меню.<br>В HTML предусмотрены два варианта обработки карт изображений: обработка карты изображения непосредственно браузером и передача на сервер координат указателя мыши для дальнейшей обработки.<br><br> <h1>Обрамление изображения</h1> Изображение в HTML может быть обрамлено прямоугольной рамкой. Для этого используется атрибут border, который задает ширину рамки вокруг изображения в пикселях.<br> <html> <body><br> <img src="logo.gif" align="left"> Изображение без рамки (по умолчанию для простых графических изображений).<br><br> <img src="logo.gif" align="left" border="5"> В данном варианте толщина рамки установлена в 5 пикселей. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>По умолчанию для простых изображения толщина рамки устанавливается равной нулю (отображаются без рамки). В противоположность этому для изображений, являющихся гиперссылками, по умолчанию устанавливается рамка толщиной 2 пикселя.<br> <html> <body><br> <a href="http://www.intuit.ru"><img src="logo.gif" align="left"></a> Несмотря на то, что значение border не задано, изображение-гиперссылка выводится обрамленным рамкой шириной 2 пикселя (значение по умолчанию)<br><br> <a href="http://www.intuit.ru"><img src="logo.gif" align="left" border="0"></a> В данном варианте рамка вокруг гиперссылки убрана благодаря принудительному присвоению параметру border нулевой толщины. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>В последнее время атрибут border при разработке Web-сайтов в подавляющем большинстве случаев используется именно для отмены рамки вокруг изображения-гиперссылки.<br><br> <h1>PNG – Portable Network Graphics</h1> В последнее время все большее распространение получает формат PNG, который был разработан для сетевых иллюстраций с целью заменить форматы JPEG и GIF и объединивший в себе все их преимущества.<br>Формат PNG поддерживает 24-, 32- и 48-битовую цветовую палитру, 8- и 16- битовую палитру серого, 8-битовую пользовательскую палитру. Реализованный в PNG алгоритм сжатия позволяет сжимать изображения лучше чем GIF (от 5 до 25%). Для него реализован механизм чересстрочного вывода первого изображения с использованием двумерной чересстрочности, что позволяет обеспечить минимальные затраты времени на вывод первого изображения.<br>Кроме того, в PNG реализован эффективный механизм контроля целостности файла, позволяющего обнаружить ошибки при передаче по сети. Хотя PNG и поддерживает прозрачность, такие изображения некорректно отображаются MS Internet Explorer, он не поддерживает прозрачность PNG, поэтому если вы хотите, чтобы во всех браузерах рисунок с прозрачным фоном отображался корректно, лучше использовать формат GIF.<br><br> <h1>Обратите внимание, что синтаксис вставки </h1> Изображение: <img src="image/primer-1_1.gif" alt="Обратите внимание, что синтаксис вставки "><br> Динамическое изображение: <img src="image/primer-1_2.gif" alt="Обратите внимание, что синтаксис вставки "><br> Обратите внимание, что синтаксис вставки динамического изображения не отличается от синтаксиса для обычного изображения. <br><br> <h1>Размещение изображений</h1> Для размещения изображений в HTML используется тег <img> с использованием обязательного атрибута src (от source – источник), который указывает URL-адрес загружаемого файла с изображением.<br>Синтаксис определения изображения:<br> <img src="url"><br> URL указывает на то место, где хранится изображение. В следующем примере на Web-странице выводится изображение логотипа интернет университета информационных технологий, расположенное в каталоге "img" на сервере "www.intuit.ru" (URL: http://www.intuit.ru/img/logo.gif).<br> <html> <body><br> <img src="http://www.intuit.ru/img/logo.gif"><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Браузер размещает изображение там, где в документе появляется тег <img>. Если разместить тег <img> между двумя параграфами, то браузер покажет первый параграф, затем изображение, а затем второй параграф.<br> <html> <body><br> Первый параграф<br> <img src="http://www.intuit.ru/img/logo.gif"> Второй параграф<br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Если же разместить тег <img> внутри параграфа, то изображение будет отображено в одной строке с текстом.<br> <html> <body><br> В этом примере изображение <img src="http://www.intuit.ru/img/logo.gif"> размещено прямо внутри параграфа<br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Формат изображения, его расположение и ряд других параметров задается при помощи атрибутов тега <img>.<br><br> <h1>Создание графических меню</h1> Другим способом создания графических меню кроме карт изображений является использование предварительно нарезанных изображений отформатированных при помощи таблиц. В этом случае первоначально готовится общий дизайн элемента web-страницы (или страницы целиком), затем на ней размечаются прямоугольные области, соответствующие отдельным подэлементам страницы (кнопка меню, меню целиком и т.п.), в соответствии с которыми производится нарезка изображения. Следующий пример демонстрирует способ создания графического меню.<br> <html> <body> <table cellpadding='0' cellspacing='0'> <tr><td><a href=""><img src="menu-1.png" border="0" alt="Новости"></a></td></tr> <tr><td><a href=""><img src="menu-2.png" border="0" alt="О компании"></a></td></tr> <tr><td><a href=""><img src="menu-3.png" border="0" alt="Услуги"></a></td></tr> <tr><td><a href=""><img src="menu-4.png" border="0" alt="Прайс- лист"></a></td></tr> <tr><td><a href=""><img src="menu-5.png" border="0" alt="Контакты"></a></td></tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br>Чтобы понять, как нарезано изображение, достаточно при отображении таблицы установить параметр border:<br> <html> <body> <table cellpadding='0' cellspacing='0' border> <tr><td><a href=""><img src="menu-1.png" border="0" alt="Новости"></a></td></tr> <tr><td><a href=""><img src="menu-2.png" border="0" alt="О компании"></a></td></tr> <tr><td><a href=""><img src="menu-3.png" border="0" alt="Услуги"></a></td></tr> <tr><td><a href=""><img src="menu-4.png" border="0" alt="Прайс-лист"></a></td></tr> <tr><td><a href=""><img src="menu-5.png" border="0" alt="Контакты"></a></td></tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Стандартное меню "Пуск" Windows</h1> <html> <body> <table cellpadding='0' cellspacing='0'> <tr> <td colspan="2"><img src="top.png"></td></tr> <tr> <td> <table cellpadding='0' cellspacing='0'> <tr> <td><a href=""><img src="left-1.png" border="0" alt="Интерне"></a></td> </tr> <tr> <td><a href=""><img src="left-2.png" border="0" alt="Электронная почта"></a></td> </tr> <tr> <td><a href=""><img src="left-3.png" border="0" alt="EmEditor"></a></td> </tr> <tr> <td><a href=""><img src="left-4.png" border="0" alt="Photoshop"></a></td> </tr> <tr> <td><a href=""><img src="left-5.png" border="0" alt="Word"></a></td> </tr> <tr> <td><a href=""><img src="left-6.png" border="0" alt="SQL Manager"></a></td> </tr> <tr> <td><a href=""><img src="left-7.png" border="0" alt="Excel"></a></td> </tr> <tr> <td><a href=""><img src="left-8.png" border="0" alt="ImageReady"></a></td> </tr> <tr> <td><a href=""><img src="left-9.png" border="0" alt="Все программы"></a></td> </tr> </table> </td> <td> <table cellpadding='0' cellspacing='0'> <tr> <td><a href=""><img src="right-1.png" border="0" alt="Мои документы"></a></td> </tr> <tr> <td><a href=""><img src="right-2.png" border="0" alt="Недавние документы"></a></td> </tr> <tr> <td><a href=""><img src="right-3.png" border="0" alt="Мои рисунки"></a></td> </tr> <tr> <td><a href=""><img src="right-4.png" border="0" alt="Моя музыка"></a></td> </tr> <tr> <td><a href=""><img src="right-5.png" border="0" alt="Мой компьютер"></a></td> </tr> <tr> <td><a href=""><img src="right-6.png" border="0" alt="Сетевое окружение"></a></td> </tr> <tr> <td><a href=""><img src="right-7.png" border="0" alt="Панель управления"></a></td> </tr> <tr> <td><a href=""><img src="right-8.png" border="0" alt="Принтеры и факсы"></a></td> </tr> <tr> <td><a href=""><img src="right-9.png" border="0" alt="Справка и поддержка"></a></td> </tr> <tr> <td><a href=""><img src="right-10.png" border="0" alt="Поиск"></a></td> </tr> <tr> <td><a href=""><img src="right-11.png" border="0" alt="Выполнить..."></a></td> </tr> </table> </td> </tr> <tr> <td colspan="2"> <table cellpadding='0' cellspacing='0'> <tr> <td><img src="bottom-1.png"></td> <td><a href=""><img src="bottom-2.png" border="0" alt="Выход из системы"></a></td> <td><a href=""><img src="bottom-3.png" border="0" alt="Выключение"></a></td> </tr> </table> </td> </tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br>На примере меню Пуск" Windows XP представлен способ организации сложных несимметричных графических меню с использованием вложенных таблиц. В данном случае используется внешняя таблица для разделения изображения на верхнюю, нижнюю, левую и правую области, и три вложенных таблицы для реализации левого, правого и нижнего графического меню.<br><table border=1>Теги изображений<tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top"><img></td><td bgcolor="#eaeaea" valign="top">Определяет изображение</td></tr><tr><td bgcolor="#eaeaea" valign="top"><map></td><td bgcolor="#eaeaea" valign="top">Определяет карту ссылок</td></tr><tr><td bgcolor="#eaeaea" valign="top"><area></td><td bgcolor="#eaeaea" valign="top">Определяет активную область внутри карты ссылок</td></tr></table><br> <br> Пример выполнения данного HTML-кода<br><br> На примере меню Пуск" Windows XP представлен способ организации сложных несимметричных графических меню с использованием вложенных таблиц. В данном случае используется внешняя таблица для разделения изображения на верхнюю, нижнюю, левую и правую области, и три вложенных таблицы для реализации левого, правого и нижнего графического меню.<br><br><table border=1>Теги изображений<tr>ТегОписание</tr><tr><td><img></td><td>Определяет изображение</td></tr><tr><td><map></td><td>Определяет карту ссылок</td></tr><tr><td><area></td><td>Определяет активную область внутри карты ссылок</td></tr></table> <tr><td><img src="../../../../img/empty.gif" alt="Стандартное меню "Пуск" Windows"></td></tr> <td><img src="../../../../img/empty.gif" alt="Стандартное меню "Пуск" Windows"></td> <table border=1> <tr><td><img src="../../../../img/empty.gif" alt="Стандартное меню "Пуск" Windows"></td></tr> <td>© 2003-2007 INTUIT.ru. Все права защищены.</td> </table><br> <h1>Вставка изображений из различных мест</h1> <html> <body><br> Изображение из другой папки: <img src="../../../../img/dvd.jpg" width="160" height="237"> <br><br> Изображение с сайта ИНТУИТ: <img src="http://www.intuit.ru/img/logo.gif" width="285" height="52"> <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как вывести на своей Web-странице изображение из другой папки или с другого сервера.<br><br> <h1>Вставка изображений</h1> <html> <body><br> Изображение: <img src="logo.gif" width="285" height="52"> <br><br> Динамическое изображение: <img src="100x100_4.gif" width="100" height="100"> <br><br> Обратите внимание, что синтаксис вставки динамического изображения не отличается от синтаксиса для обычного изображения. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как вывести изображения на Web-странице.<br><br> <h1>Выравнивание изображений</h1> Для выравнивания изображений используется атрибут align.<br><li>align=top – изображение выравнивается по верхнему краю текущей текстовой строки, не меняя позиции по горизонтали. При этом речь идет как о тексте, так и о графике;</li><li>align=middle – изображение центрируется по вертикали на базовой линии текущей текстовой строки, не меняя позицию по горизонтали;</li><li>align=bottom – нижний край изображения выравнивается по горизонтали на базовой линии текущей текстовой строки;</li><li>align=left – изображение смещается к левому краю рабочей зоны, последующий текст сразу же начинает "обтекать" графику;</li><li> – то же что и для left, только изображение смещается к правой части рабочей зоны.</li><br> Следующий пример показывает различные варианты выравнивания изображений в тексте.<br> <html> <body><br> Изображение выравнено по верху <img src="http://www.intuit.ru/img/logo.gif" align="top"> при помощи align="top"<br><br> Значение "middle" атрибута align <img src="http://www.intuit.ru/img/logo.gif" align="middle"> центрирует изображение по вертикали<br><br> Выравнивание изображения по нижнему краю <img src="http://www.intuit.ru/img/logo.gif" align="bottom"> (align="bottom") используется по умолчанию (можно сравнить с предыдущим примером).<br><br> В этом примере изображение <img src="http://www.intuit.ru/img/logo.gif" align="left"> смещено влево и начиная со следующей строчки текст как бы обтекает вставленный рисунок. При таком способе выравнивания желательно помещать изображение в начале параграфа.<br><br> <img src="http://www.intuit.ru/img/logo.gif" align="right"> Изображение прижато к правому краю рабочей области (align="right"). Текст занимает все свободное пространство слева от изображения обтекая его.<br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Кроме того, для форматирования изображений внутри текста используются атрибуты hspace и vspace, которые определяют интервал между графическим изображением и обтекающим текстом по горизонтали и вертикали соответственно. Размер отступов задается в пикселях.<br> <html> <body><br> <img src="logo.gif" align="left"> В данном варианте используются установленные по умолчанию значения hspace и vspase. Изображение выравнено по левому краю при помощи align="left".<br><br> <img src="logo.gif" align="left" hspace="20" vspace="20"> В данном варианте значения hspace и vspace установлены равными 20. Обратите внимание, что эти параметры влияют не столько на отступ от текста до изображения, сколько на величину свободной зоны вокруг изображения вообще. В данном случае изображение сместилось вправо вниз. <br><br> Примечание: Для лучшего понимания работы атрибутов hspace и vspase в данном примере уменьшите размер окна Вашего браузера. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1> Основы работы с HTML </h1> <h1>Миллионов различных цветов</h1> Сочетание значений красного, зеленого и синего цветов от 0 до 255 дает в целом более 16 миллионов различных цветов (256 x 256 x 256).<br>Более современные мониторы могут выводить не менее 16384 различных цветов.<br>Если посмотреть на таблицу цветов приведенную в примере, то можно увидеть результат изменения интенсивности красного цвета от 0 до 255, при значениях зеленого и синего цветов равных нулю.<br> <html> <body> <table> <tr><td width="20" bgcolor="#000000"></td><td>#000000</td><td>rgb(0,0,0)</td></tr> <tr><td width="20" bgcolor="#080000"></td><td>#080000</td><td>rgb(8,0,0)</td></tr> <tr><td width="20" bgcolor="#100000"></td><td>#100000</td><td>rgb(16,0,0)</td></tr> <tr><td width="20" bgcolor="#180000"></td><td>#180000</td><td>rgb(24,0,0)</td></tr> <tr><td width="20" bgcolor="#200000"></td><td>#200000</td><td>rgb(32,0,0)</td></tr> <tr><td width="20" bgcolor="#280000"></td><td>#280000</td><td>rgb(40,0,0)</td></tr> <tr><td width="20" bgcolor="#300000"></td><td>#300000</td><td>rgb(48,0,0)</td></tr> <tr><td width="20" bgcolor="#380000"></td><td>#380000</td><td>rgb(56,0,0)</td></tr> <tr><td width="20" bgcolor="#400000"></td><td>#400000</td><td>rgb(64,0,0)</td></tr> <tr><td width="20" bgcolor="#480000"></td><td>#480000</td><td>rgb(72,0,0)</td></tr> <tr><td width="20" bgcolor="#500000"></td><td>#500000</td><td>rgb(80,0,0)</td></tr> <tr><td width="20" bgcolor="#580000"></td><td>#580000</td><td>rgb(88,0,0)</td></tr> <tr><td width="20" bgcolor="#600000"></td><td>#600000</td><td>rgb(96,0,0)</td></tr> <tr><td width="20" bgcolor="#680000"></td><td>#680000</td><td>rgb(104,0,0)</td></tr> <tr><td width="20" bgcolor="#700000"></td><td>#700000</td><td>rgb(112,0,0)</td></tr> <tr><td width="20" bgcolor="#780000"></td><td>#780000</td><td>rgb(120,0,0)</td></tr> <tr><td width="20" bgcolor="#800000"></td><td>#800000</td><td>rgb(128,0,0)</td></tr> <tr><td width="20" bgcolor="#880000"></td><td>#880000</td><td>rgb(136,0,0)</td></tr> <tr><td width="20" bgcolor="#900000"></td><td>#900000</td><td>rgb(144,0,0)</td></tr> <tr><td width="20" bgcolor="#980000"></td><td>#980000</td><td>rgb(152,0,0)</td></tr> <tr><td width="20" bgcolor="#A00000"></td><td>#A00000</td><td>rgb(160,0,0)</td></tr> <tr><td width="20" bgcolor="#A80000"></td><td>#A80000</td><td>rgb(168,0,0)</td></tr> <tr><td width="20" bgcolor="#B00000"></td><td>#B00000</td><td>rgb(176,0,0)</td></tr> <tr><td width="20" bgcolor="#B80000"></td><td>#B80000</td><td>rgb(184,0,0)</td></tr> <tr><td width="20" bgcolor="#C00000"></td><td>#C00000</td><td>rgb(192,0,0)</td></tr> <tr><td width="20" bgcolor="#C80000"></td><td>#C80000</td><td>rgb(200,0,0)</td></tr> <tr><td width="20" bgcolor="#D00000"></td><td>#D00000</td><td>rgb(208,0,0)</td></tr> <tr><td width="20" bgcolor="#D80000"></td><td>#D80000</td><td>rgb(216,0,0)</td></tr> <tr><td width="20" bgcolor="#E00000"></td><td>#E00000</td><td>rgb(224,0,0)</td></tr> <tr><td width="20" bgcolor="#E80000"></td><td>#E80000</td><td>rgb(232,0,0)</td></tr> <tr><td width="20" bgcolor="#F00000"></td><td>#F00000</td><td>rgb(240,0,0)</td></tr> <tr><td width="20" bgcolor="#F80000"></td><td>#F80000</td><td>rgb(248,0,0)</td></tr> <tr><td width="20" bgcolor="#FF0000"></td><td>#FF0000</td><td>rgb(255,0,0)</td></tr> </table><br> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Межплатформенных цветов</h1> Эта палитра из 216 межплатформенных безопасных для Web цветов была первоначально создана для обеспечения правильного вывода всеми компьютерами всех цветов при использовании палитры из 256 цветов.<br> <html> <body> <table border> <tr> <td width=20 bgcolor="#000000"></td><td>000000</td> <td width=20 bgcolor="#000033"></td><td>000033</td> <td width=20 bgcolor="#000066"></td><td>000066</td> <td width=20 bgcolor="#000099"></td><td>000099</td> <td width=20 bgcolor="#0000CC"></td><td>0000CC</td> <td width=20 bgcolor="#0000FF"></td><td>0000FF</td> </tr> <tr> <td width=20 bgcolor="#003300"></td><td>003300</td> <td width=20 bgcolor="#003333"></td><td>003333</td> <td width=20 bgcolor="#003366"></td><td>003366</td> <td width=20 bgcolor="#003399"></td><td>003399</td> <td width=20 bgcolor="#0033CC"></td><td>0033CC</td> <td width=20 bgcolor="#0033FF"></td><td>0033FF</td> </tr> <tr> <td width=20 bgcolor="#006600"></td><td>006600</td> <td width=20 bgcolor="#006633"></td><td>006633</td> <td width=20 bgcolor="#006666"></td><td>006666</td> <td width=20 bgcolor="#006699"></td><td>006699</td> <td width=20 bgcolor="#0066CC"></td><td>0066CC</td> <td width=20 bgcolor="#0066FF"></td><td>0066FF</td> </tr> <tr> <td width=20 bgcolor="#009900"></td><td>009900</td> <td width=20 bgcolor="#009933"></td><td>009933</td> <td width=20 bgcolor="#009966"></td><td>009966</td> <td width=20 bgcolor="#009999"></td><td>009999</td> <td width=20 bgcolor="#0099CC"></td><td>0099CC</td> <td width=20 bgcolor="#0099FF"></td><td>0099FF</td> </tr> <tr> <td width=20 bgcolor="#00CC00"></td><td>00CC00</td> <td width=20 bgcolor="#00CC33"></td><td>00CC33</td> <td width=20 bgcolor="#00CC66"></td><td>00CC66</td> <td width=20 bgcolor="#00CC99"></td><td>00CC99</td> <td width=20 bgcolor="#00CCCC"></td><td>00CCCC</td> <td width=20 bgcolor="#00CCFF"></td><td>00CCFF</td> </tr> <tr> <td width=20 bgcolor="#00FF00"></td><td>00FF00</td> <td width=20 bgcolor="#00FF33"></td><td>00FF33</td> <td width=20 bgcolor="#00FF66"></td><td>00FF66</td> <td width=20 bgcolor="#00FF99"></td><td>00FF99</td> <td width=20 bgcolor="#00FFCC"></td><td>00FFCC</td> <td width=20 bgcolor="#00FFFF"></td><td>00FFFF</td> </tr> <tr> <td width=20 bgcolor="#330000"></td><td>330000</td> <td width=20 bgcolor="#330033"></td><td>330033</td> <td width=20 bgcolor="#330066"></td><td>330066</td> <td width=20 bgcolor="#330099"></td><td>330099</td> <td width=20 bgcolor="#3300CC"></td><td>3300CC</td> <td width=20 bgcolor="#3300FF"></td><td>3300FF</td> </tr> <tr> <td width=20 bgcolor="#333300"></td><td>333300</td> <td width=20 bgcolor="#333333"></td><td>333333</td> <td width=20 bgcolor="#333366"></td><td>333366</td> <td width=20 bgcolor="#333399"></td><td>333399</td> <td width=20 bgcolor="#3333CC"></td><td>3333CC</td> <td width=20 bgcolor="#3333FF"></td><td>3333FF</td> </tr> <tr> <td width=20 bgcolor="#336600"></td><td>336600</td> <td width=20 bgcolor="#336633"></td><td>336633</td> <td width=20 bgcolor="#336666"></td><td>336666</td> <td width=20 bgcolor="#336699"></td><td>336699</td> <td width=20 bgcolor="#3366CC"></td><td>3366CC</td> <td width=20 bgcolor="#3366FF"></td><td>3366FF</td> </tr> <tr> <td width=20 bgcolor="#339900"></td><td>339900</td> <td width=20 bgcolor="#339933"></td><td>339933</td> <td width=20 bgcolor="#339966"></td><td>339966</td> <td width=20 bgcolor="#339999"></td><td>339999</td> <td width=20 bgcolor="#3399CC"></td><td>3399CC</td> <td width=20 bgcolor="#3399FF"></td><td>3399FF</td> </tr> <tr> <td width=20 bgcolor="#33CC00"></td><td>33CC00</td> <td width=20 bgcolor="#33CC33"></td><td>33CC33</td> <td width=20 bgcolor="#33CC66"></td><td>33CC66</td> <td width=20 bgcolor="#33CC99"></td><td>33CC99</td> <td width=20 bgcolor="#33CCCC"></td><td>33CCCC</td> <td width=20 bgcolor="#33CCFF"></td><td>33CCFF</td> </tr> <tr> <td width=20 bgcolor="#33FF00"></td><td>33FF00</td> <td width=20 bgcolor="#33FF33"></td><td>33FF33</td> <td width=20 bgcolor="#33FF66"></td><td>33FF66</td> <td width=20 bgcolor="#33FF99"></td><td>33FF99</td> <td width=20 bgcolor="#33FFCC"></td><td>33FFCC</td> <td width=20 bgcolor="#33FFFF"></td><td>33FFFF</td> </tr> <tr> <td width=20 bgcolor="#660000"></td><td>660000</td> <td width=20 bgcolor="#660033"></td><td>660033</td> <td width=20 bgcolor="#660066"></td><td>660066</td> <td width=20 bgcolor="#660099"></td><td>660099</td> <td width=20 bgcolor="#6600CC"></td><td>6600CC</td> <td width=20 bgcolor="#6600FF"></td><td>6600FF</td> </tr> <tr> <td width=20 bgcolor="#663300"></td><td>663300</td> <td width=20 bgcolor="#663333"></td><td>663333</td> <td width=20 bgcolor="#663366"></td><td>663366</td> <td width=20 bgcolor="#663399"></td><td>663399</td> <td width=20 bgcolor="#6633CC"></td><td>6633CC</td> <td width=20 bgcolor="#6633FF"></td><td>6633FF</td> </tr> <tr> <td width=20 bgcolor="#666600"></td><td>666600</td> <td width=20 bgcolor="#666633"></td><td>666633</td> <td width=20 bgcolor="#666666"></td><td>666666</td> <td width=20 bgcolor="#666699"></td><td>666699</td> <td width=20 bgcolor="#6666CC"></td><td>6666CC</td> <td width=20 bgcolor="#6666FF"></td><td>6666FF</td> </tr> <tr> <td width=20 bgcolor="#669900"></td><td>669900</td> <td width=20 bgcolor="#669933"></td><td>669933</td> <td width=20 bgcolor="#669966"></td><td>669966</td> <td width=20 bgcolor="#669999"></td><td>669999</td> <td width=20 bgcolor="#6699CC"></td><td>6699CC</td> <td width=20 bgcolor="#6699FF"></td><td>6699FF</td> </tr> <tr> <td width=20 bgcolor="#66CC00"></td><td>66CC00</td> <td width=20 bgcolor="#66CC33"></td><td>66CC33</td> <td width=20 bgcolor="#66CC66"></td><td>66CC66</td> <td width=20 bgcolor="#66CC99"></td><td>66CC99</td> <td width=20 bgcolor="#66CCCC"></td><td>66CCCC</td> <td width=20 bgcolor="#66CCFF"></td><td>66CCFF</td> </tr> <tr> <td width=20 bgcolor="#66FF00"></td><td>66FF00</td> <td width=20 bgcolor="#66FF33"></td><td>66FF33</td> <td width=20 bgcolor="#66FF66"></td><td>66FF66</td> <td width=20 bgcolor="#66FF99"></td><td>66FF99</td> <td width=20 bgcolor="#66FFCC"></td><td>66FFCC</td> <td width=20 bgcolor="#66FFFF"></td><td>66FFFF</td> </tr> <tr> <td width=20 bgcolor="#990000"></td><td>990000</td> <td width=20 bgcolor="#990033"></td><td>990033</td> <td width=20 bgcolor="#990066"></td><td>990066</td> <td width=20 bgcolor="#990099"></td><td>990099</td> <td width=20 bgcolor="#9900CC"></td><td>9900CC</td> <td width=20 bgcolor="#9900FF"></td><td>9900FF</td> </tr> <tr> <td width=20 bgcolor="#993300"></td><td>993300</td> <td width=20 bgcolor="#993333"></td><td>993333</td> <td width=20 bgcolor="#993366"></td><td>993366</td> <td width=20 bgcolor="#993399"></td><td>993399</td> <td width=20 bgcolor="#9933CC"></td><td>9933CC</td> <td width=20 bgcolor="#9933FF"></td><td>9933FF</td> </tr> <tr> <td width=20 bgcolor="#996600"></td><td>996600</td> <td width=20 bgcolor="#996633"></td><td>996633</td> <td width=20 bgcolor="#996666"></td><td>996666</td> <td width=20 bgcolor="#996699"></td><td>996699</td> <td width=20 bgcolor="#9966CC"></td><td>9966CC</td> <td width=20 bgcolor="#9966FF"></td><td>9966FF</td> </tr> <tr> <td width=20 bgcolor="#999900"></td><td>999900</td> <td width=20 bgcolor="#999933"></td><td>999933</td> <td width=20 bgcolor="#999966"></td><td>999966</td> <td width=20 bgcolor="#999999"></td><td>999999</td> <td width=20 bgcolor="#9999CC"></td><td>9999CC</td> <td width=20 bgcolor="#9999FF"></td><td>9999FF</td> </tr> <tr> <td width=20 bgcolor="#99CC00"></td><td>99CC00</td> <td width=20 bgcolor="#99CC33"></td><td>99CC33</td> <td width=20 bgcolor="#99CC66"></td><td>99CC66</td> <td width=20 bgcolor="#99CC99"></td><td>99CC99</td> <td width=20 bgcolor="#99CCCC"></td><td>99CCCC</td> <td width=20 bgcolor="#99CCFF"></td><td>99CCFF</td> </tr> <tr> <td width=20 bgcolor="#99FF00"></td><td>99FF00</td> <td width=20 bgcolor="#99FF33"></td><td>99FF33</td> <td width=20 bgcolor="#99FF66"></td><td>99FF66</td> <td width=20 bgcolor="#99FF99"></td><td>99FF99</td> <td width=20 bgcolor="#99FFCC"></td><td>99FFCC</td> <td width=20 bgcolor="#99FFFF"></td><td>99FFFF</td> </tr> <tr> <td width=20 bgcolor="#CC0000"></td><td>CC0000</td> <td width=20 bgcolor="#CC0033"></td><td>CC0033</td> <td width=20 bgcolor="#CC0066"></td><td>CC0066</td> <td width=20 bgcolor="#CC0099"></td><td>CC0099</td> <td width=20 bgcolor="#CC00CC"></td><td>CC00CC</td> <td width=20 bgcolor="#CC00FF"></td><td>CC00FF</td> </tr> <tr> <td width=20 bgcolor="#CC3300"></td><td>CC3300</td> <td width=20 bgcolor="#CC3333"></td><td>CC3333</td> <td width=20 bgcolor="#CC3366"></td><td>CC3366</td> <td width=20 bgcolor="#CC3399"></td><td>CC3399</td> <td width=20 bgcolor="#CC33CC"></td><td>CC33CC</td> <td width=20 bgcolor="#CC33FF"></td><td>CC33FF</td> </tr> <tr> <td width=20 bgcolor="#CC6600"></td><td>CC6600</td> <td width=20 bgcolor="#CC6633"></td><td>CC6633</td> <td width=20 bgcolor="#CC6666"></td><td>CC6666</td> <td width=20 bgcolor="#CC6699"></td><td>CC6699</td> <td width=20 bgcolor="#CC66CC"></td><td>CC66CC</td> <td width=20 bgcolor="#CC66FF"></td><td>CC66FF</td> </tr> <tr> <td width=20 bgcolor="#CC9900"></td><td>CC9900</td> <td width=20 bgcolor="#CC9933"></td><td>CC9933</td> <td width=20 bgcolor="#CC9966"></td><td>CC9966</td> <td width=20 bgcolor="#CC9999"></td><td>CC9999</td> <td width=20 bgcolor="#CC99CC"></td><td>CC99CC</td> <td width=20 bgcolor="#CC99FF"></td><td>CC99FF</td> </tr> <tr> <td width=20 bgcolor="#CCCC00"></td><td>CCCC00</td> <td width=20 bgcolor="#CCCC33"></td><td>CCCC33</td> <td width=20 bgcolor="#CCCC66"></td><td>CCCC66</td> <td width=20 bgcolor="#CCCC99"></td><td>CCCC99</td> <td width=20 bgcolor="#CCCCCC"></td><td>CCCCCC</td> <td width=20 bgcolor="#CCCCFF"></td><td>CCCCFF</td> </tr> <tr> <td width=20 bgcolor="#CCFF00"></td><td>CCFF00</td> <td width=20 bgcolor="#CCFF33"></td><td>CCFF33</td> <td width=20 bgcolor="#CCFF66"></td><td>CCFF66</td> <td width=20 bgcolor="#CCFF99"></td><td>CCFF99</td> <td width=20 bgcolor="#CCFFCC"></td><td>CCFFCC</td> <td width=20 bgcolor="#CCFFFF"></td><td>CCFFFF</td> </tr> <tr> <td width=20 bgcolor="#FF0000"></td><td>FF0000</td> <td width=20 bgcolor="#FF0033"></td><td>FF0033</td> <td width=20 bgcolor="#FF0066"></td><td>FF0066</td> <td width=20 bgcolor="#FF0099"></td><td>FF0099</td> <td width=20 bgcolor="#FF00CC"></td><td>FF00CC</td> <td width=20 bgcolor="#FF00FF"></td><td>FF00FF</td> </tr> <tr> <td width=20 bgcolor="#FF3300"></td><td>FF3300</td> <td width=20 bgcolor="#FF3333"></td><td>FF3333</td> <td width=20 bgcolor="#FF3366"></td><td>FF3366</td> <td width=20 bgcolor="#FF3399"></td><td>FF3399</td> <td width=20 bgcolor="#FF33CC"></td><td>FF33CC</td> <td width=20 bgcolor="#FF33FF"></td><td>FF33FF</td> </tr> <tr> <td width=20 bgcolor="#FF6600"></td><td>FF6600</td> <td width=20 bgcolor="#FF6633"></td><td>FF6633</td> <td width=20 bgcolor="#FF6666"></td><td>FF6666</td> <td width=20 bgcolor="#FF6699"></td><td>FF6699</td> <td width=20 bgcolor="#FF66CC"></td><td>FF66CC</td> <td width=20 bgcolor="#FF66FF"></td><td>FF66FF</td> </tr> <tr> <td width=20 bgcolor="#FF9900"></td><td>FF9900</td> <td width=20 bgcolor="#FF9933"></td><td>FF9933</td> <td width=20 bgcolor="#FF9966"></td><td>FF9966</td> <td width=20 bgcolor="#FF9999"></td><td>FF9999</td> <td width=20 bgcolor="#FF99CC"></td><td>FF99CC</td> <td width=20 bgcolor="#FF99FF"></td><td>FF99FF</td> </tr> <tr> <td width=20 bgcolor="#FFCC00"></td><td>FFCC00</td> <td width=20 bgcolor="#FFCC33"></td><td>FFCC33</td> <td width=20 bgcolor="#FFCC66"></td><td>FFCC66</td> <td width=20 bgcolor="#FFCC99"></td><td>FFCC99</td> <td width=20 bgcolor="#FFCCCC"></td><td>FFCCCC</td> <td width=20 bgcolor="#FFCCFF"></td><td>FFCCFF</td> </tr> <tr> <td width=20 bgcolor="#FFFF00"></td><td>FFFF00</td> <td width=20 bgcolor="#FFFF33"></td><td>FFFF33</td> <td width=20 bgcolor="#FFFF66"></td><td>FFFF66</td> <td width=20 bgcolor="#FFFF99"></td><td>FFFF99</td> <td width=20 bgcolor="#FFFFCC"></td><td>FFFFCC</td> <td width=20 bgcolor="#FFFFFF"></td><td>FFFFFF</td> </tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Background</h1> Атрибут background определяет изображение для фона страницы HTML. Значением этого атрибута является адрес URL изображения, которое желательно использовать. Если изображение меньше окна браузера, то изображение будет циклически повторяться, пока не заполнит все окно браузера.<br> <body background="clouds.gif"> <body background="http://www.w3schools.com/clouds.gif"><br> Адрес URL может быть относительным (как в первой строке выше) или абсолютным (как во второй строке выше).<br>Примечание: Если вы хотите использовать фоновое изображение, необходимо помнить о следующем:<br><li>Не будет ли фоновое изображение слишком увеличивать время загрузки?</li><li>Будет ли фоновое изображение хорошо сочетаться с другими изображениями на странице?</li><li>Будет ли фоновое изображение хорошо сочетаться с цветами текста на странице?</li><li>Будет ли фоновое изображение хорошо выглядеть, когда оно циклически повторяется на странице?</li><li>Не будет ли фоновое изображение отвлекать внимание от текста?</li><br><br> <h1>Безопасные цвета Web</h1> Несколько лет назад, когда большинство компьютеров поддерживали только 256 различных цветов, был предложен в качестве стандарта Web список из 216 безопасных цветов Web. Причина этого состояла в том, что операционные системы Microsoft и Mac использовали 40 различных "резервных" фиксированных системных цветов (около 20 каждая).<br>Трудно сказать насколько это важно сегодня, так как все больше и больше компьютеров обладают возможностью выводить миллионы различных цветов, но такой стандарт существует, и его при желании можно придерживаться.<br><br> <h1>Bgcolor</h1> Атрибут bgcolor определяет цвет фона для страницы HTML. Значение этого атрибута может быть шестнадцатеричным числом, значением RGB, или названием цвета:<br> <body bgcolor="#000000"> <body bgcolor="rgb(0,0,0)"> <body bgcolor="black"><br> Все приведенные выше строки задают цвет фона как черный. Наиболее часто используется первый способ задания цвета.<br><br> <h1>Цвета в HTML</h1> Цвета выводятся с помощью смешения источников RED (красного), GREEN (зеленого), и BLUE (синего) цвета.<br><br> <h1>Дополнительные примеры</h1> <img src="image/dopolnitelnye-primery_1.jpg" alt="Дополнительные примеры"><br>Хорошее фоновое изображение<br> <html> <body background="background.jpg"> <h3>Фоновое изображение</h3> В качестве фона HTML можно использовать как файлы gif, png, так и файлы jpg.<br> Если изображение меньше страницы, то изображение будет циклически повторяться.<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Пример фонового изображения и цвета текста, которые позволяют легко читать текст на странице.<br><img src="image/dopolnitelnye-primery_2.jpg" alt="Дополнительные примеры"><br>Хорошее фоновое изображение<br> <html> <body background="good.jpg"> <h3>Фоновое изображение</h3> В качестве фона HTML можно использовать как файлы gif, png, так и файлы jpg.<br> Если изображение меньше страницы, то изображение будет циклически повторяться.<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Пример фонового изображения и цвета текста, которые позволяют легко читать текст на странице.<br><img src="image/dopolnitelnye-primery_3.jpg" alt="Дополнительные примеры"><br>Плохое фоновое изображение<br> <html> <body background="bad.jpg"> <h3>Фоновое изображение</h3> В качестве фона HTML можно использовать как файлы gif, png, так и файлы jpg.<br> Если изображение меньше страницы, то изображение будет циклически повторяться.<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Пример фонового изображения и цвета текста, которые существенно затрудняют чтение текста. И кроме того очень большой размер данной картинки сильно увеличивает время загрузки.<br><br> <h1>Фон</h1> Тег <body> имеет два атрибута, которые позволяют определить фон. Фон можно задавать с помощью цвета или изображения.<br><br> <h1>Фоновое изображение</h1> В качестве фона HTML можно использовать как файлы gif, png, так и файлы jpg.<br> Если изображение меньше страницы, то изображение будет циклически повторяться.<br><br> <h1>Хороший цвет фона и текста</h1> Пример комбинации цвета фона и цвета текста, которая позволяет без проблем читать текст на странице.<br><br> <h1>Имена цветов</h1> Некоторая совокупность названий цветов поддерживается большинством браузеров.<br>Примечание: Только 16 названий цветов поддерживается стандартом W3C для HTML 4.0 (aqua (голубой), black (черный), blue (синий), fuchsia (фуксия), gray (серый), green (зеленый), lime (лайм), maroon (темно-бордовый), navy (темно-синий), olive (оливковый), purple (сиреневый), red (красный), silver (светло-серый), teal (сине-зеленый), white (белый), и yellow (желтый)). Для всех других цветов необходимо использовать значение HEX цвета.<br><br> <h1>Названия цветов в HTML</h1> Здесь представлена таблица имен цветов, которые поддерживаются большинством браузеров.<br>Примечание: Стандарт HTML 4.0 консорциума W3C поддерживает только 16 имен цветов (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow). Для всех остальных цветов необходимо использовать HEX (шестнадцатеричное) значение цвета. <br> <html> <body> <table> <tr><th>Название цвета</th><th>HEX цвета</th><th>Цвет</th></tr> <tr><td>AliceBlue (бледно-голубой)</td><td>#F0F8FF</td><td bgcolor="#F0F8FF"> </td></tr> <tr><td>AntiqueWhite (античный белый)</td><td>#FAEBD7</td><td bgcolor="#FAEBD7"> </td></tr> <tr><td>Aqua (голубой)</td><td>#00FFFF</td><td bgcolor="#00FFFF"> </td></tr> <tr><td>Aquamarine (аквамарин)</td><td>#7FFFD4</td><td bgcolor="#7FFFD4"> </td></tr> <tr><td>Azure (лазурный)</td><td>#F0FFFF</td><td bgcolor="#F0FFFF"> </td></tr> <tr><td>Beige (беж)</td><td>#F5F5DC</td><td bgcolor="#F5F5DC"> </td></tr> <tr><td>Bisque (бисквитный)</td><td>#FFE4C4</td><td bgcolor="#FFE4C4"> </td></tr> <tr><td>Black (черный)</td><td>#000000</td><td bgcolor="#000000"> </td></tr> <tr><td>BlanchedAlmond (светло-кремовый)</td><td>#FFEBCD</td><td bgcolor="#FFEBCD"> </td></tr> <tr><td>Blue (синий)</td><td>#0000FF</td><td bgcolor="#0000FF"> </td></tr> <tr><td>BlueViolet (сине-фиолетовый)</td><td>#8A2BE2</td><td bgcolor="#8A2BE2"> </td></tr> <tr><td>Brown (коричневый)</td><td>#A52A2A</td><td bgcolor="#A52A2A"> </td></tr> <tr><td>BurlyWood (старое дерево)</td><td>#DEB887</td><td bgcolor="#DEB887"> </td></tr> <tr><td>CadetBlue (серо-голубой)</td><td>#5F9EA0</td><td bgcolor="#5F9EA0"> </td></tr> <tr><td>Chartreuse (зеленовато-желтый)</td><td>#7FFF00</td><td bgcolor="#7FFF00"> </td></tr> <tr><td>Chocolate (шоколадный)</td><td>#D2691E</td><td bgcolor="#D2691E"> </td></tr> <tr><td>Coral (коралловый)</td><td>#FF7F50</td><td bgcolor="#FF7F50"> </td></tr> <tr><td>CornflowerBlue (васильковый)</td><td>#6495ED</td><td bgcolor="#6495ED"> </td></tr> <tr><td>Cornsilk (кукурузные рыльца)</td><td>#FFF8DC</td><td bgcolor="#FFF8DC"> </td></tr> <tr><td>Crimson (малиновый)</td><td>#DC143C</td><td bgcolor="#DC143C"> </td></tr> <tr><td>Cyan (светло-голубой)</td><td>#00FFFF</td><td bgcolor="#00FFFF"> </td></tr> <tr><td>DarkBlue (темно-синий)</td><td>#00008B</td><td bgcolor="#00008B"> </td></tr> <tr><td>DarkCyan (темно-голубой)</td><td>#008B8B</td><td bgcolor="#008B8B"> </td></tr> <tr><td>DarkGoldenRod (темно-золотисто-коричневый)</td><td>#B8860B</td><td bgcolor="#B8860B"> </td></tr> <tr><td>DarkGray (темно-серый)</td><td>#A9A9A9</td><td bgcolor="#A9A9A9"> </td></tr> <tr><td>DarkGreen (темно-зеленый)</td><td>#006400</td><td bgcolor="#006400"> </td></tr> <tr><td>DarkKhaki (темный хаки)</td><td>#BDB76B</td><td bgcolor="#BDB76B"> </td></tr> <tr><td>DarkMagenta (темно-пурпурный)</td><td>#8B008B</td><td bgcolor="#8B008B"> </td></tr> <tr><td>DarkOliveGreen (темно-оливково-зеленый)</td><td>#556B2F</td><td bgcolor="#556B2F"> </td></tr> <tr><td>Darkorange (темно-оранжевый)</td><td>#FF8C00</td><td bgcolor="#FF8C00"> </td></tr> <tr><td>DarkOrchid (темно-лиловый)</td><td>#9932CC</td><td bgcolor="#9932CC"> </td></tr> <tr><td>DarkRed (темно-красный)</td><td>#8B0000</td><td bgcolor="#8B0000"> </td></tr> <tr><td>DarkSalmon (темно-оранжево-розовый)</td><td>#E9967A</td><td bgcolor="#E9967A"> </td></tr> <tr><td>DarkSeaGreen (темно-зеленое море)</td><td>#8FBC8F</td><td bgcolor="#8FBC8F"> </td></tr> <tr><td>DarkSlateBlue (темный серовато-синий)</td><td>#483D8B</td><td bgcolor="#483D8B"> </td></tr> <tr><td>DarkSlateGray (темный синевато-серый)</td><td>#2F4F4F</td><td bgcolor="#2F4F4F"> </td></tr> <tr><td>DarkTurquoise (темно-бирюзовый)</td><td>#00CED1</td><td bgcolor="#00CED1"> </td></tr> <tr><td>DarkViolet (темно-фиолетовый)</td><td>#9400D3</td><td bgcolor="#9400D3"> </td></tr> <tr><td>DeepPink (темно-розовый)</td><td>#FF1493</td><td bgcolor="#FF1493"> </td></tr> <tr><td>DeepSkyBlue (темно-небесно-голубой)</td><td>#00BFFF</td><td bgcolor="#00BFFF"> </td></tr> <tr><td>DimGray (тускло-серый)</td><td>#696969</td><td bgcolor="#696969"> </td></tr> <tr><td>DodgerBlue (тускло-васильковый)</td><td>#1E90FF</td><td bgcolor="#1E90FF"> </td></tr> <tr><td>Feldspar (полевой шпат)</td><td>#D19275</td><td bgcolor="#D19275"> </td></tr> <tr><td>FireBrick (огнеупорный кирпич)</td><td>#B22222</td><td bgcolor="#B22222"> </td></tr> <tr><td>FloralWhite (цветочно-белый)</td><td>#FFFAF0</td><td bgcolor="#FFFAF0"> </td></tr> <tr><td>ForestGreen (лесная зелень)</td><td>#228B22</td><td bgcolor="#228B22"> </td></tr> <tr><td>Fuchsia (фуксия)</td><td>#FF00FF</td><td bgcolor="#FF00FF"> </td></tr> <tr><td>Gainsboro (светло-серый)</td><td>#DCDCDC</td><td bgcolor="#DCDCDC"> </td></tr> <tr><td>GhostWhite (туманно-белый)</td><td>#F8F8FF</td><td bgcolor="#F8F8FF"> </td></tr> <tr><td>Gold (золотой)</td><td>#FFD700</td><td bgcolor="#FFD700"> </td></tr> <tr><td>GoldenRod (золотисто-коричневый)</td><td>#DAA520</td><td bgcolor="#DAA520"> </td></tr> <tr><td>Gray (серый)</td><td>#808080</td><td bgcolor="#808080"> </td></tr> <tr><td>Green (зеленый)</td><td>#008000</td><td bgcolor="#008000"> </td></tr> <tr><td>GreenYellow (зелено-желтый)</td><td>#ADFF2F</td><td bgcolor="#ADFF2F"> </td></tr> <tr><td>HoneyDew (медовая роса)</td><td>#F0FFF0</td><td bgcolor="#F0FFF0"> </td></tr> <tr><td>HotPink (ярко-розовый)</td><td>#FF69B4</td><td bgcolor="#FF69B4"> </td></tr> <tr><td>IndianRed (индийский-красный)</td><td>#CD5C5C</td><td bgcolor="#CD5C5C"> </td></tr> <tr><td>Indigo (индиго)</td><td>#4B0082</td><td bgcolor="#4B0082"> </td></tr> <tr><td>Ivory (слоновая кость)</td><td>#FFFFF0</td><td bgcolor="#FFFFF0"> </td></tr> <tr><td>Khaki</td><td>(хаки)</td><td bgcolor="(хаки)"> </td></tr> <tr><td>Lavender (бледно-лиловый)</td><td>#E6E6FA</td><td bgcolor="#E6E6FA"> </td></tr> <tr><td>LavenderBlush (бледный розово-лиловый)</td><td>#FFF0F5</td><td bgcolor="#FFF0F5"> </td></tr> <tr><td>LawnGreen (зеленая трава)</td><td>#7CFC00</td><td bgcolor="#7CFC00"> </td></tr> <tr><td>LemonChiffon (лимонный)</td><td>#FFFACD</td><td bgcolor="#FFFACD"> </td></tr> <tr><td>LightBlue (светло-синий)</td><td>#ADD8E6</td><td bgcolor="#ADD8E6"> </td></tr> <tr><td>LightCoral (светло-коралловый)</td><td>#F08080</td><td bgcolor="#F08080"> </td></tr> <tr><td>LightCyan (светло-светло-голубой)</td><td>#E0FFFF</td><td bgcolor="#E0FFFF"> </td></tr> <tr><td>LightGoldenRodYellow (светлый коричнево-желтый)</td><td>#FAFAD2</td><td bgcolor="#FAFAD2"> </td></tr> <tr><td>LightGrey (светло-серый)</td><td>#D3D3D3</td><td bgcolor="#D3D3D3"> </td></tr> <tr><td>LightGreen (светло-зеленый)</td><td>#90EE90</td><td bgcolor="#90EE90"> </td></tr> <tr><td>LightPink (светло-розовый)</td><td>#FFB6C1</td><td bgcolor="#FFB6C1"> </td></tr> <tr><td>LightSalmon (светлый оранжево-розовый)</td><td>#FFA07A</td><td bgcolor="#FFA07A"> </td></tr> <tr><td>LightSeaGreen (светло-зеленое море)</td><td>#20B2AA</td><td bgcolor="#20B2AA"> </td></tr> <tr><td>LightSkyBlue (светло-небесно-голубой)</td><td>#87CEFA</td><td bgcolor="#87CEFA"> </td></tr> <tr><td>LightSlateBlue (светлый серовато-синий)</td><td>#8470FF</td><td bgcolor="#8470FF"> </td></tr> <tr><td>LightSlateGray (светлый синевато-серый)</td><td>#778899</td><td bgcolor="#778899"> </td></tr> <tr><td>LightSteelBlue (светлый голубовато стальной)</td><td>#B0C4DE</td><td bgcolor="#B0C4DE"> </td></tr> <tr><td>LightYellow (светло-желтый)</td><td>#FFFFE0</td><td bgcolor="#FFFFE0"> </td></tr> <tr><td>Lime (лайм)</td><td>#00FF00</td><td bgcolor="#00FF00"> </td></tr> <tr><td>LimeGreen (зеленый лайм)</td><td>#32CD32</td><td bgcolor="#32CD32"> </td></tr> <tr><td>Linen (льняной)</td><td>#FAF0E6</td><td bgcolor="#FAF0E6"> </td></tr> <tr><td>Magenta (пурпурный)</td><td>#FF00FF</td><td bgcolor="#FF00FF"> </td></tr> <tr><td>Maroon (каштановый)</td><td>#800000</td><td bgcolor="#800000"> </td></tr> <tr><td>MediumAquaMarine (умеренно аквамариновый)</td><td>#66CDAA</td><td bgcolor="#66CDAA"> </td></tr> <tr><td>MediumBlue (умеренно синий)</td><td>#0000CD</td><td bgcolor="#0000CD"> </td></tr> <tr><td>MediumOrchid (умеренно лиловый)</td><td>#BA55D3</td><td bgcolor="#BA55D3"> </td></tr> <tr><td>MediumPurple (умеренно пурпурный)</td><td>#9370D8</td><td bgcolor="#9370D8"> </td></tr> <tr><td>MediumSeaGreen (умеренно-зеленое море)</td><td>#3CB371</td><td bgcolor="#3CB371"> </td></tr> <tr><td>MediumSlateBlue (умеренно серовато-синий)</td><td>#7B68EE</td><td bgcolor="#7B68EE"> </td></tr> <tr><td>MediumSpringGreen (умеренная весенняя зелень)</td><td>#00FA9A</td><td bgcolor="#00FA9A"> </td></tr> <tr><td>MediumTurquoise (умеренно-бирюзовый)</td><td>#48D1CC</td><td bgcolor="#48D1CC"> </td></tr> <tr><td>MediumVioletRed (умеренно фиолетово красный)</td><td>#C71585</td><td bgcolor="#C71585"> </td></tr> <tr><td>MidnightBlue (ночной синий)</td><td>#191970</td><td bgcolor="#191970"> </td></tr> <tr><td>MintCream (мятно-кремовый)</td><td>#F5FFFA</td><td bgcolor="#F5FFFA"> </td></tr> <tr><td>MistyRose (туманно-розовый)</td><td>#FFE4E1</td><td bgcolor="#FFE4E1"> </td></tr> <tr><td>Moccasin (песочный)</td><td></td><td bgcolor=""> </td></tr> <tr><td>NavajoWhite (темно-песочный)</td><td>#FFDEAD</td><td bgcolor="#FFDEAD"> </td></tr> <tr><td>Navy (темно-синий)</td><td>#000080</td><td bgcolor="#000080"> </td></tr> <tr><td>OldLace (старые кружева)</td><td>#FDF5E6</td><td bgcolor="#FDF5E6"> </td></tr> <tr><td>Olive (оливковый)</td><td>#808000</td><td bgcolor="#808000"> </td></tr> <tr><td>OliveDrab (тускло-оливковый)</td><td>#6B8E23</td><td bgcolor="#6B8E23"> </td></tr> <tr><td>Orange (оранжевый)</td><td>#FFA500</td><td bgcolor="#FFA500"> </td></tr> <tr><td>OrangeRed (оранжево-красный)</td><td>#FF4500</td><td bgcolor="#FF4500"> </td></tr> <tr><td>Orchid (лиловый)</td><td>#DA70D6</td><td bgcolor="#DA70D6"> </td></tr> <tr><td>PaleGoldenRod (бледно-золотисто-коричневый)</td><td>#EEE8AA</td><td bgcolor="#EEE8AA"> </td></tr> <tr><td>PaleGreen (бледно-зеленый)</td><td>#98FB98</td><td bgcolor="#98FB98"> </td></tr> <tr><td>PaleTurquoise (бледно-голубой)</td><td></td><td bgcolor=""> </td></tr> <tr><td>PaleVioletRed (бледно-фиолетово-красный)</td><td>#D87093</td><td bgcolor="#D87093"> </td></tr> <tr><td>PapayaWhip (дыни)</td><td>#FFEFD5</td><td bgcolor="#FFEFD5"> </td></tr> <tr><td>PeachPuff (персиковый)</td><td>#FFDAB9</td><td bgcolor="#FFDAB9"> </td></tr> <tr><td>Peru (коричневый)</td><td>#CD853F</td><td bgcolor="#CD853F"> </td></tr> <tr><td>Pink (розовый)</td><td>#FFC0CB</td><td bgcolor="#FFC0CB"> </td></tr> <tr><td>Plum (сливовый)</td><td>#DDA0DD</td><td bgcolor="#DDA0DD"> </td></tr> <tr><td>PowderBlue (туманно-голубой)</td><td>#B0E0E6</td><td bgcolor="#B0E0E6"> </td></tr> <tr><td>Purple</td><td>(пурпурный)</td><td bgcolor="(пурпурный)"> </td></tr> <tr><td>Red (красный)</td><td>#FF0000</td><td bgcolor="#FF0000"> </td></tr> <tr><td>RosyBrown (розово-коричневый)</td><td>#BC8F8F</td><td bgcolor="#BC8F8F"> </td></tr> <tr><td>RoyalBlue (ярко-синий)</td><td>#4169E1</td><td bgcolor="#4169E1"> </td></tr> <tr><td>SaddleBrown (старая кожа)</td><td>#8B4513</td><td bgcolor="#8B4513"> </td></tr> <tr><td>Salmon (оранжево-розовый)</td><td>#FA8072</td><td bgcolor="#FA8072"> </td></tr> <tr><td>SandyBrown (песочно-коричневый)</td><td>#F4A460</td><td bgcolor="#F4A460"> </td></tr> <tr><td>SeaGreen (зеленое море)</td><td>#2E8B57</td><td bgcolor="#2E8B57"> </td></tr> <tr><td>SeaShell (морская ракушка)</td><td>#FFF5EE</td><td bgcolor="#FFF5EE"> </td></tr> <tr><td>Sienna</td><td>(охра)</td><td bgcolor="(охра)"> </td></tr> <tr><td>Silver (свето-серый)</td><td>#C0C0C0</td><td bgcolor="#C0C0C0"> </td></tr> <tr><td>SkyBlue (небесно-голубой)</td><td>#87CEEB</td><td bgcolor="#87CEEB"> </td></tr> <tr><td>SlateBlue (серовато-синий)</td><td>#6A5ACD</td><td bgcolor="#6A5ACD"> </td></tr> <tr><td>SlateGray (синевато-серый)</td><td>#708090</td><td bgcolor="#708090"> </td></tr> <tr><td>Snow (снежный)</td><td>#FFFAFA</td><td bgcolor="#FFFAFA"> </td></tr> <tr><td>SpringGreen (весенняя зелень)</td><td>#00FF7F</td><td bgcolor="#00FF7F"> </td></tr> <tr><td>SteelBlue (сине-стальной)</td><td>#4682B4</td><td bgcolor="#4682B4"> </td></tr> <tr><td>Tan (бронзы)</td><td>#D2B48C</td><td bgcolor="#D2B48C"> </td></tr> <tr><td>Teal (сине-зеленый)</td><td>#008080</td><td bgcolor="#008080"> </td></tr> <tr><td>Thistle (чертополох)</td><td>#D8BFD8</td><td bgcolor="#D8BFD8"> </td></tr> <tr><td>Tomato (томат)</td><td>#FF6347</td><td bgcolor="#FF6347"> </td></tr> <tr><td>Turquoise (бирюзовый)</td><td>#40E0D0</td><td bgcolor="#40E0D0"> </td></tr> <tr><td>Violet</td><td>(фиолетовый)</td><td bgcolor="(фиолетовый)"> </td></tr> <tr><td>VioletRed (фиолетово-красный)</td><td>#D02090</td><td bgcolor="#D02090"> </td></tr> <tr><td>Wheat</td><td>(пшеничный)</td><td bgcolor="(пшеничный)"> </td></tr> <tr><td>White (белый)</td><td>#FFFFFF</td><td bgcolor="#FFFFFF"> </td></tr> <tr><td>WhiteSmoke (белый дым)</td><td>#F5F5F5</td><td bgcolor="#F5F5F5"> </td></tr> <tr><td>Yellow (желтый)</td><td>#FFFF00</td><td bgcolor="#FFFF00"> </td></tr> <tr><td>YellowGreen (желто-зеленый)</td><td>#9ACD32</td><td bgcolor="#9ACD32"> </td></tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Отключение красного цвета</h1> Если полностью отключить красный цвет, то существует 65536 различных комбинаций зеленого и синего (256 x 256) цветов для экспериментов.<br><br> <h1>Оттенки серого цвета</h1> Серые цвета получаются при равном значении интенсивности всех трех цветов. Чтобы облегчить выбор правильного серого цвета, ниже, в примере, представлена таблица оттенков серого:<br> <html> <body> <table> <tr><td bgcolor="#000000"> </td><td>RGB(0,0,0)</td><td>#000000</td></tr> <tr><td bgcolor="#080808"> </td><td>RGB(8,8,8)</td><td>#080808</td></tr> <tr><td bgcolor="#101010"> </td><td>RGB(16,16,16)</td><td>#101010</td></tr> <tr><td bgcolor="#181818"> </td><td>RGB(24,24,24)</td><td>#181818</td></tr> <tr><td bgcolor="#202020"> </td><td>RGB(32,32,32)</td><td>#202020</td></tr> <tr><td bgcolor="#282828"> </td><td>RGB(40,40,40)</td><td>#282828</td></tr> <tr><td bgcolor="#303030"> </td><td>RGB(48,48,48)</td><td>#303030</td></tr> <tr><td bgcolor="#383838"> </td><td>RGB(56,56,56)</td><td>#383838</td></tr> <tr><td bgcolor="#404040"> </td><td>RGB(64,64,64)</td><td>#404040</td></tr> <tr><td bgcolor="#484848"> </td><td>RGB(72,72,72)</td><td>#484848</td></tr> <tr><td bgcolor="#505050"> </td><td>RGB(80,80,80)</td><td>#505050</td></tr> <tr><td bgcolor="#585858"> </td><td>RGB(88,88,88)</td><td>#585858</td></tr> <tr><td bgcolor="#606060"> </td><td>RGB(96,96,96)</td><td>#606060</td></tr> <tr><td bgcolor="#686868"> </td><td>RGB(104,104,104)</td><td>#686868</td></tr> <tr><td bgcolor="#707070"> </td><td>RGB(112,112,112)</td><td>#707070</td></tr> <tr><td bgcolor="#787878"> </td><td>RGB(120,120,120)</td><td>#787878</td></tr> <tr><td bgcolor="#808080"> </td><td>RGB(128,128,128)</td><td>#808080</td></tr> <tr><td bgcolor="#888888"> </td><td>RGB(136,136,136)</td><td>#888888</td></tr> <tr><td bgcolor="#909090"> </td><td>RGB(144,144,144)</td><td>#909090</td></tr> <tr><td bgcolor="#989898"> </td><td>RGB(152,152,152)</td><td>#989898</td></tr> <tr><td bgcolor="#A0A0A0"> </td><td>RGB(160,160,160)</td><td>#A0A0A0</td></tr> <tr><td bgcolor="#A8A8A8"> </td><td>RGB(168,168,168)</td><td>#A8A8A8</td></tr> <tr><td bgcolor="#B0B0B0"> </td><td>RGB(176,176,176)</td><td>#B0B0B0</td></tr> <tr><td bgcolor="#B8B8B8"> </td><td>RGB(184,184,184)</td><td>#B8B8B8</td></tr> <tr><td bgcolor="#C0C0C0"> </td><td>RGB(192,192,192)</td><td>#C0C0C0</td></tr> <tr><td bgcolor="#C8C8C8"> </td><td>RGB(200,200,200)</td><td>#C8C8C8</td></tr> <tr><td bgcolor="#D0D0D0"> </td><td>RGB(208,208,208)</td><td>#D0D0D0</td></tr> <tr><td bgcolor="#D8D8D8"> </td><td>RGB(216,216,216)</td><td>#D8D8D8</td></tr> <tr><td bgcolor="#E0E0E0"> </td><td>RGB(224,224,224)</td><td>#E0E0E0</td></tr> <tr><td bgcolor="#E8E8E8"> </td><td>RGB(232,232,232)</td><td>#E8E8E8</td></tr> <tr><td bgcolor="#F0F0F0"> </td><td>RGB(240,240,240)</td><td>#F0F0F0</td></tr> <tr><td bgcolor="#F8F8F8"> </td><td>RGB(248,248,248)</td><td>#F8F8F8</td></tr> <tr><td bgcolor="#FFFFFF"> </td><td>RGB(255,255,255)</td><td>#FFFFFF</td></tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Плохой цвет фона и текста</h1> Пример комбинации цвета фона и цвета текста, которая создает трудности при чтении текста на странице.<br><br> <h1>Полезные рекомендации</h1> Атрибуты bgcolor, background, и text в теге <body> не рекомендуется использовать в последних версиях HTML (HTML 4 и XHTML). Консорциум World Wide Web (W3C) исключил эти атрибуты из своих рекомендаций.<br>Вместо этого должны использоваться таблицы стилей (CSS) (для определения свойств компоновки и вывода элементов HTML). Используя таблицы стилей можно более гибко управлять настройками фона.<br><br> <h1>Пример bgcolor="#000000"</h1> <table border=1><br> <tr> <td></td><td>000000</td> <td></td><td>000033</td> <td></td><td>000066</td> <td></td><td>000099</td> <td></td><td>0000CC</td> <td></td><td>0000FF</td> </tr> <tr> <td></td><td>003300</td> <td></td><td>003333</td> <td></td><td>003366</td> <td></td><td>003399</td> <td></td><td>0033CC</td> <td></td><td>0033FF</td> </tr> <tr> <td></td><td>006600</td> <td></td><td>006633</td> <td></td><td>006666</td> <td></td><td>006699</td> <td></td><td>0066CC</td> <td></td><td>0066FF</td> </tr> <tr> <td></td><td>009900</td> <td></td><td>009933</td> <td></td><td>009966</td> <td></td><td>009999</td> <td></td><td>0099CC</td> <td></td><td>0099FF</td> </tr> <tr> <td></td><td>00CC00</td> <td></td><td>00CC33</td> <td></td><td>00CC66</td> <td></td><td>00CC99</td> <td></td><td>00CCCC</td> <td></td><td>00CCFF</td> </tr> <tr> <td></td><td>00FF00</td> <td></td><td>00FF33</td> <td></td><td>00FF66</td> <td></td><td>00FF99</td> <td></td><td>00FFCC</td> <td></td><td>00FFFF</td> </tr> <tr> <td></td><td>330000</td> <td></td><td>330033</td> <td></td><td>330066</td> <td></td><td>330099</td> <td></td><td>3300CC</td> <td></td><td>3300FF</td> </tr> <tr> <td></td><td>333300</td> <td></td><td>333333</td> <td></td><td>333366</td> <td></td><td>333399</td> <td></td><td>3333CC</td> <td></td><td>3333FF</td> </tr> <tr> <td></td><td>336600</td> <td></td><td>336633</td> <td></td><td>336666</td> <td></td><td>336699</td> <td></td><td>3366CC</td> <td></td><td>3366FF</td> </tr> <tr> <td></td><td>339900</td> <td></td><td>339933</td> <td></td><td>339966</td> <td></td><td>339999</td> <td></td><td>3399CC</td> <td></td><td>3399FF</td> </tr> <tr> <td></td><td>33CC00</td> <td></td><td>33CC33</td> <td></td><td>33CC66</td> <td></td><td>33CC99</td> <td></td><td>33CCCC</td> <td></td><td>33CCFF</td> </tr> <tr> <td></td><td>33FF00</td> <td></td><td>33FF33</td> <td></td><td>33FF66</td> <td></td><td>33FF99</td> <td></td><td>33FFCC</td> <td></td><td>33FFFF</td> </tr> <tr> <td></td><td>660000</td> <td></td><td>660033</td> <td></td><td>660066</td> <td></td><td>660099</td> <td></td><td>6600CC</td> <td></td><td>6600FF</td> </tr> <tr> <td></td><td>663300</td> <td></td><td>663333</td> <td></td><td>663366</td> <td></td><td>663399</td> <td></td><td>6633CC</td> <td></td><td>6633FF</td> </tr> <tr> <td></td><td>666600</td> <td></td><td>666633</td> <td></td><td>666666</td> <td></td><td>666699</td> <td></td><td>6666CC</td> <td></td><td>6666FF</td> </tr> <tr> <td></td><td>669900</td> <td></td><td>669933</td> <td></td><td>669966</td> <td></td><td>669999</td> <td></td><td>6699CC</td> <td></td><td>6699FF</td> </tr> <tr> <td></td><td>66CC00</td> <td></td><td>66CC33</td> <td></td><td>66CC66</td> <td></td><td>66CC99</td> <td></td><td>66CCCC</td> <td></td><td>66CCFF</td> </tr> <tr> <td></td><td>66FF00</td> <td></td><td>66FF33</td> <td></td><td>66FF66</td> <td></td><td>66FF99</td> <td></td><td>66FFCC</td> <td></td><td>66FFFF</td> </tr> <tr> <td></td><td>990000</td> <td></td><td>990033</td> <td></td><td>990066</td> <td></td><td>990099</td> <td></td><td>9900CC</td> <td></td><td>9900FF</td> </tr> <tr> <td></td><td>993300</td> <td></td><td>993333</td> <td></td><td>993366</td> <td></td><td>993399</td> <td></td><td>9933CC</td> <td></td><td>9933FF</td> </tr> <tr> <td></td><td>996600</td> <td></td><td>996633</td> <td></td><td>996666</td> <td></td><td>996699</td> <td></td><td>9966CC</td> <td></td><td>9966FF</td> </tr> <tr> <td></td><td>999900</td> <td></td><td>999933</td> <td></td><td>999966</td> <td></td><td>999999</td> <td></td><td>9999CC</td> <td></td><td>9999FF</td> </tr> <tr> <td></td><td>99CC00</td> <td></td><td>99CC33</td> <td></td><td>99CC66</td> <td></td><td>99CC99</td> <td></td><td>99CCCC</td> <td></td><td>99CCFF</td> </tr> <tr> <td></td><td>99FF00</td> <td></td><td>99FF33</td> <td></td><td>99FF66</td> <td></td><td>99FF99</td> <td></td><td>99FFCC</td> <td></td><td>99FFFF</td> </tr> <tr> <td></td><td>CC0000</td> <td></td><td>CC0033</td> <td></td><td>CC0066</td> <td></td><td>CC0099</td> <td></td><td>CC00CC</td> <td></td><td>CC00FF</td> </tr> <tr> <td></td><td>CC3300</td> <td></td><td>CC3333</td> <td></td><td>CC3366</td> <td></td><td>CC3399</td> <td></td><td>CC33CC</td> <td></td><td>CC33FF</td> </tr> <tr> <td></td><td>CC6600</td> <td></td><td>CC6633</td> <td></td><td>CC6666</td> <td></td><td>CC6699</td> <td></td><td>CC66CC</td> <td></td><td>CC66FF</td> </tr> <tr> <td></td><td>CC9900</td> <td></td><td>CC9933</td> <td></td><td>CC9966</td> <td></td><td>CC9999</td> <td></td><td>CC99CC</td> <td></td><td>CC99FF</td> </tr> <tr> <td></td><td>CCCC00</td> <td></td><td>CCCC33</td> <td></td><td>CCCC66</td> <td></td><td>CCCC99</td> <td></td><td>CCCCCC</td> <td></td><td>CCCCFF</td> </tr> <tr> <td></td><td>CCFF00</td> <td></td><td>CCFF33</td> <td></td><td>CCFF66</td> <td></td><td>CCFF99</td> <td></td><td>CCFFCC</td> <td></td><td>CCFFFF</td> </tr> <tr> <td></td><td>FF0000</td> <td></td><td>FF0033</td> <td></td><td>FF0066</td> <td></td><td>FF0099</td> <td></td><td>FF00CC</td> <td></td><td>FF00FF</td> </tr> <tr> <td></td><td>FF3300</td> <td></td><td>FF3333</td> <td></td><td>FF3366</td> <td></td><td>FF3399</td> <td></td><td>FF33CC</td> <td></td><td>FF33FF</td> </tr> <tr> <td></td><td>FF6600</td> <td></td><td>FF6633</td> <td></td><td>FF6666</td> <td></td><td>FF6699</td> <td></td><td>FF66CC</td> <td></td><td>FF66FF</td> </tr> <tr> <td></td><td>FF9900</td> <td></td><td>FF9933</td> <td></td><td>FF9966</td> <td></td><td>FF9999</td> <td></td><td>FF99CC</td> <td></td><td>FF99FF</td> </tr> <tr> <td></td><td>FFCC00</td> <td></td><td>FFCC33</td> <td></td><td>FFCC66</td> <td></td><td>FFCC99</td> <td></td><td>FFCCCC</td> <td></td><td>FFCCFF</td> </tr> <tr> <td></td><td>FFFF00</td> <td></td><td>FFFF33</td> <td></td><td>FFFF66</td> <td></td><td>FFFF99</td> <td></td><td>FFFFCC</td> <td></td><td>FFFFFF</td> </tr> </table> <h1>Включение красного цвета</h1> Задавая для параметра красного цвета (R) максимальное значение, мы также получим 65536 различных комбинаций зеленого и синего (256 x 256) цветов для экспериментов.<br><br> <h1>Значения цветов в HTML</h1> Цвета выводятся при смешении красного (R), зеленого (G), и синего (B) источников.<br><br> <h1>Значения цветов</h1> Цвета определяют с помощью шестнадцатеричной записи комбинации значений красного, зеленого и синего цветов (RGB). Наименьшее значение, которое можно задать одному из источников равно 0 (hex #00). Максимальное значение равно 255 (hex #FF).<br>Следующий пример показывает результат объединения красного (R), зеленого (G) и синего (B) источников цвета.<br> <html> <body> <table> <tr><th>Цвет</th><th>Цвет (HEX)</th><th>Цвет (RGB)</th></tr> <tr><td bgcolor="#000000"> </td><td>#000000</td><td>rgb(0,0,0)</td></tr> <tr><td bgcolor="#FF0000"> </td><td>#FF0000</td><td>rgb(255,0,0)</td></tr> <tr><td bgcolor="#00FF00"> </td><td>#00FF00</td><td>rgb(0,255,0)</td></tr> <tr><td bgcolor="#0000FF"> </td><td>#0000FF</td><td>rgb(0,0,255)</td></tr> <tr><td bgcolor="#FFFF00"> </td><td>#FFFF00</td><td>rgb(255,255,0)</td></tr> <tr><td bgcolor="#00FFFF"> </td><td>#00FFFF</td><td>rgb(0,255,255)</td></tr> <tr><td bgcolor="#FF00FF"> </td><td>#FF00FF</td><td>rgb(255,0,255)</td></tr> <tr><td bgcolor="#C0C0C0"> </td><td>#C0C0C0</td><td>rgb(192,192,192)</td></tr> <tr><td bgcolor="#FFFFFF"> </td><td>#FFFFFF</td><td>rgb(255,255,255)</td></tr> <table> <body> <html><br> Пример выполнения данного HTML-кода<br><br> <h1> Основы работы с HTML </h1> <h1>Атрибуты языка</h1> Не действительны в элементах base, br, frame, frameset, hr, iframe, param и script.<br><table border=1><tr>АтрибутЗначениеОписание</tr><tr><td bgcolor="#eaeaea" valign="top">dir</td><td bgcolor="#eaeaea" valign="top">ltr | rtl</td><td bgcolor="#eaeaea" valign="top">Задает направление вывода текста</td></tr><tr><td bgcolor="#eaeaea" valign="top">lang</td><td bgcolor="#eaeaea" valign="top">код_языка</td><td bgcolor="#eaeaea" valign="top">Задает код языка</td></tr></table><br><br> <h1>Атрибуты клавиатуры</h1> <table border=1><tr>АтрибутЗначениеОписание</tr><tr><td bgcolor="#eaeaea" valign="top">accesskey</td><td bgcolor="#eaeaea" valign="top">символ</td><td bgcolor="#eaeaea" valign="top">Задает клавишу быстрого доступа для элемента</td></tr><tr><td bgcolor="#eaeaea" valign="top">tabindex</td><td bgcolor="#eaeaea" valign="top">число</td><td bgcolor="#eaeaea" valign="top">Задает для элемента порядок перехода по клавише табуляции</td></tr></table><br><br> <h1>Атрибуты событий формы</h1> Действительны только в элементах form.<br><table border=1><tr>АтрибутЗначениеОписание</tr><tr><td bgcolor="#eaeaea" valign="top">onchange</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется при изменении элемента</td></tr><tr><td bgcolor="#eaeaea" valign="top">onsubmit</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется при отправке формы</td></tr><tr><td bgcolor="#eaeaea" valign="top">onreset</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется при сбросе формы</td></tr><tr><td bgcolor="#eaeaea" valign="top">onselect</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется при выборе элемента</td></tr><tr><td bgcolor="#eaeaea" valign="top">onblur</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется, когда элемент теряет фокуса</td></tr><tr><td bgcolor="#eaeaea" valign="top">onfocus</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется, когда элемент получает фокус</td></tr></table><br><br> <h1>Атрибуты событий клавиатуры</h1> Не действительны в элементах base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, title.<br><table border=1><tr>АтрибутЗначениеОписание</tr><tr><td bgcolor="#eaeaea" valign="top">onkeydown</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда нажата клавиша</td></tr><tr><td bgcolor="#eaeaea" valign="top">onkeypress</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда клавиша нажата и отпущена</td></tr><tr><td bgcolor="#eaeaea" valign="top">onkeyup</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда клавиша отпущена</td></tr></table><br><br> <h1>Атрибуты событий мыши</h1> Не действительны в элементах base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, title.<br><table border=1><tr>АтрибутЗначениеОписание</tr><tr><td bgcolor="#eaeaea" valign="top">onclick</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать при щелчке мыши</td></tr><tr><td bgcolor="#eaeaea" valign="top">ondblclick</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать при двойном щелчке мыши</td></tr><tr><td bgcolor="#eaeaea" valign="top">onmousedown</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда нажата клавиша мыши</td></tr><tr><td bgcolor="#eaeaea" valign="top">onmousemove</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда перемещается указатель мыши</td></tr><tr><td bgcolor="#eaeaea" valign="top">onmouseout</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда указатель мыши покидает элемент</td></tr><tr><td bgcolor="#eaeaea" valign="top">onmouseover</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда указатель мыши проходит над элементом</td></tr><tr><td bgcolor="#eaeaea" valign="top">onmouseup</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Что делать, когда кнопка мыши отпущена</td></tr></table><br><br> <h1>Атрибуты событий окна</h1> Действительны только в элементах body и frameset.<br><table border=1><tr>АтрибутЗначениеОписание</tr><tr><td bgcolor="#eaeaea" valign="top">onload</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется при загрузке документа</td></tr><tr><td bgcolor="#eaeaea" valign="top">onunload</td><td bgcolor="#eaeaea" valign="top">сценарий</td><td bgcolor="#eaeaea" valign="top">Сценарий, который выполняется при выгрузке документа</td></tr></table><br><br> <h1>является возможность для событий </h1> Новым в HTML 4. 0 является возможность для событий HTML запускать действия браузера, такие как запуск JavaScript, когда пользователь щелкает на элементе HTML.<br><br>Ниже представлен список атрибутов, которые можно использовать в тегах HTML для определения действий событий.<br><br>Чтобы больше узнать о программировании с помощью этих событий, почитайте учебники по JavaScript и DHTML.<br><br> <h1>Базовые атрибуты</h1> Не действительны в элементах base, head, html, meta, param, script, style, и title.<br><table border=1><tr>АтрибутЗначениеОписание</tr><tr><td bgcolor="#eaeaea" valign="top">class</td><td bgcolor="#eaeaea" valign="top">class_rule или style_rule</td><td bgcolor="#eaeaea" valign="top">Класс элемента</td></tr><tr><td bgcolor="#eaeaea" valign="top">id</td><td bgcolor="#eaeaea" valign="top">номер_id</td><td bgcolor="#eaeaea" valign="top">Уникальный id элемента</td></tr><tr><td bgcolor="#eaeaea" valign="top">style</td><td bgcolor="#eaeaea" valign="top">определение_стиля</td><td bgcolor="#eaeaea" valign="top">Определение встроенного стиля</td></tr><tr><td bgcolor="#eaeaea" valign="top">title</td><td bgcolor="#eaeaea" valign="top">текст_подсказки</td><td bgcolor="#eaeaea" valign="top">Текст, выводимый в качестве подсказки</td></tr></table><br><br> <h1>Добавление сценария на страницу HTML</h1> Сценарий в HTML определяют с помощью тега <script>. Обратите внимание, что для определения языка сценария необходимо использовать атрибут type.<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> </head> <body><br> <script type="text/javascript"> document.write("Всем привет!") </script><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот сценарий создаст следующий вывод:<br>Всем привет!<br> Примечание: Чтобы узнать больше о сценариях в HTML, почитайте соответствующий учебник по JavaScript.<br><br> <h1>Использование шрифтов в HTML</h1> Тег <font> в HTML использовать не рекомендуется. Предполагается, что он будет удален в будущей версии HTML.<br>Даже если его использует множество людей, лучше стараться его избегать и использовать вместо этого стили.<br>С помощью следующего кода HTML можно определить как размер шрифта, так и тип вывода в браузере:<br> <html> <body><br> <font size="2" face="Verdana"> Это параграф. </font> <br><br> <font size="5" face="Times"> Это другой параграф. </font> <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br><table border=1>Атрибуты шрифта<tr>АтрибутПримерНазначение</tr><tr><td bgcolor="#eaeaea" valign="top">size="число"</td><td bgcolor="#eaeaea" valign="top">size="2"</td><td bgcolor="#eaeaea" valign="top">Определяет размер шрифта</td></tr><tr><td bgcolor="#eaeaea" valign="top">size="+число"</td><td bgcolor="#eaeaea" valign="top">size="+1"</td><td bgcolor="#eaeaea" valign="top">Увеличивает размер шрифта</td></tr><tr><td bgcolor="#eaeaea" valign="top">size="-число"</td><td bgcolor="#eaeaea" valign="top">size="-1"</td><td bgcolor="#eaeaea" valign="top">Уменьшает размер шрифта</td></tr><tr><td bgcolor="#eaeaea" valign="top">face="название шрифта"</td><td bgcolor="#eaeaea" valign="top">face="Times"</td><td bgcolor="#eaeaea" valign="top">Определяет название шрифта</td></tr><tr><td bgcolor="#eaeaea" valign="top">color="значение цвета"</td><td bgcolor="#eaeaea" valign="top">color="#eeff00"</td><td bgcolor="#eaeaea" valign="top">Определяет цвет шрифта</td></tr><tr><td bgcolor="#eaeaea" valign="top">color="название цвета"</td><td bgcolor="#eaeaea" valign="top">color="red"</td><td bgcolor="#eaeaea" valign="top">Определяет цвет шрифта</td></tr></table><br> Тег <font> НЕ должен использоваться.<br>Тег <font> не рекомендуется использовать в последних версиях HTML (HTML 4 и XHTML).<br>Консорциум World Wide Web (W3C) удалил тег <font> из своих рекомендаций. В будущих версиях HTML, для определения свойств компоновки и вывода элементов HTML будут использоваться таблицы стилей (CSS).<br>Правильно будет использовать стили - Примеры<br>Задание шрифта текста<br> <html> <body> <h1 style="font-family:verdana">Заголовок </h1> <p style="font-family:courier">Параграф<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Задание размера шрифта текста<br> <html> <body> <h1 style="font-size:150%">Заголовок</h1> <p style="font-size:80%">Параграф<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Задание цвета шрифта текста<br> <br> <html> <body> <h1 style="color:blue">Заголовок </h1> <p style="color:red">Параграф<br> </body> </html><br><br> Пример выполнения данного HTML-кода<br><br> Задание для текста шрифта, его размера и цвета<br><br> <html> <body> <p style="font-family:verdana;font-size:80%;color:green"> Это параграф, содержащий некоторый текст. Это текст, содержащийся в параграфе. Это все тот-же параграф с текстом. <br> </body> </html><br><br> Пример выполнения данного HTML-кода<br><br>Прежде всего: Дочитайте до конца это учебное руководство по HTML!!! В последующих лекциях будет показано, почему некоторые теги, такие как <font>, должны быть удалены из рекомендаций HTML, и как использовать таблицы стилей в документе HTML.<br><br>Чтобы больше узнать о таблицах стилей, найдите хороший учебник.<br><br>Зачем использовать HTML 4.0?<br><br>HTML предназначался для других целей!<br><br>Исходный HTML не предполагалось использовать для форматирования документа. Теги HTML должны были определять содержимое документа, например:<br><br> Это параграф<br><br><br> <h1>Это заголовок</h1><br><br> Когда в спецификацию HTML 3.2 были добавлены такие теги как <font> и атрибуты цвета, то для разработчиков Web начался просто кошмар. Разработка больших Web-сайтов, где информацию о шрифтах и цвете добавлять на каждую Web-страницу, стала длительным, дорогим и чрезмерно болезненным процессом.<br><br>В чем достоинство HTML 4.0 ?<br><br>В HTML 4.0 все форматирование можно удалить из документа HTML и хранить в отдельной таблице стилей.<br><br>Так как HTML 4.0 отделяет представление от структуры документа, мы получили то, что всегда требовалось: полный контроль за компоновкой представления без потери содержимого документа.<br><br>Не используйте атрибуты представления в тегах HTML, если этого можно избежать. Начните использовать стили! Прочтите учебник по CSS, чтобы познакомиться с таблицами стилей.<br><br>Не используйте не рекомендованные теги. Просмотрите полный справочник по HTML 4.01, чтобы узнать, какие теги и атрибуты не рекомендовано использовать.<br><br>Готовьтесь к использованию XHTML<br><br>XHTML является "новым" HTML. Самая важная вещь, которую можно сделать на данном этапе, -- начать писать действительный HTML 4.01 код. Начните также записывать свои теги в нижнем регистре. Всегда закрывайте свои теговые элементы. Никогда не заканчивайте параграф без завершающего <br>.<br><br>Примечание: Официальный HTML 4.01 рекомендует использовать теги в нижнем регистре.<br><br>Если вы хотите больше узнать о XHTML, почитайте соответствующий учебник.<br><br>Проверяйте свои файлы HTML на соответствие HTML 4.01<br><br>Документ HTML проверяется согласно Определению типа документа (DTD). Прежде чем файл HTML можно будет проверить, необходимо добавить в качестве первой строки файла правильный DTD.<br><br>DTD Strict (строгий) для HTML 4.01 включает элементы и атрибуты, которые рекомендованы к использованию и не появляются в наборах фреймов:<br><br> <br> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><br><br> DTD Transitional (переходный) для HTML 4. 01 включает все из строгого DTD плюс не рекомендованные элементы и атрибуты:<br><br> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><br><br> DTD Frameset (набор фреймов) для HTML 4.01 включает все из переходного DTD плюс также фреймы:<br><br> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"><br><br> Проверьте свой файл HTML с помощью средства проверки W3C<br><br>Введите адрес своей страницы в поле формы, показанной ниже:<br><br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <form method="get" action="http://validator.w3.org/check" target="_blank"> Введите адрес своей страницы в расположенное ниже поле <br /> <br /> <input name="uri" size="50" /> <br /><br /> <input type="submit" value="Validate the page" /> </form> </body> </html><br><br> Пример выполнения данного HTML-кода<br><br> <h1>Использование стилей в HTML</h1> В HTML 4.0 все форматирование можно переместить из документа HTML в отдельную таблицу стилей.<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <style type="text/css"> h1 {color: red} h3 {color: blue} </style> </head><br> <body> <h1>Это заголовок 1</h1> <h3>Это заголовок 3</h3> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как форматировать документ HTML с помощью информации о стилях, добавленной в раздел заголовка <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/>.<br> <html> <body><br> <a href="lastpage.htm" style="text-decoration:none"> ЭТО НЕПОДЧЕРКНУТАЯ ССЫЛКА! </a><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как с помощью атрибута style сделать ссылку, которая не подчеркивается.<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <link rel="stylesheet" type="text/css" href="styles.css" > </head><br> <body> <h1>Я отформатирован с помощью присоединенной таблицы стилей</h1> Я тоже!<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как использовать тег <link> для соединения с внешней таблицей стилей.<br><br> <h1>JavaScript и VBscript</h1> JavaScript это разработанный корпорацией Netscape межплатформенный объектно-ориентированный язык сценариев. Язык JavaScript основан на языке Java, а VBscript - на Visual Basic. JavaScript содержит набор основных объектов и набор элементов языка. Используя его можно на лету менять внешний вид документа, в зависимости от изменения каких-либо условий, проводить первичную обработку информации отправляемой через формы и многое другое.<br>Язык VBscript является "изобретением" компании Microsoft. Язык VBscript проще и понятней для начинающих программистов и Web-дизайнеров. Но несомненным преимуществом JavaScript является его всесторонняя поддержка, а также легкость и удобство кода, унаследованные из Java и C/C++. Практически все широко распространенные браузеры имеют встроенную поддержку JavaScript, так что нет необходимости беспокоиться, будет ли ваша интерактивная страница работать.<br><br> <h1>Элемент head</h1> Элемент head содержит общую информацию,называемую также мета-информацией, о документе. Мета означает "информация о чем-то".<br>Можно сказать, что мета-данные означают информацию о данных, или мета-информация означает информацию об информации.<br>Элементы внутри элемента head не выводяться браузером. Согласно стандарту HTML, внутри раздела head допустимы только несколько тегов. Это теги <base>, <link>, <meta>, <title>, <style>, и <script>.<br>Посмотрите на следующую незаконную конструкцию:<br> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> Это какой-то текст<br> </head><br> В этом случае у браузера есть две возможности:<br><li>Вывести текст, потому что он находится внутри элемента параграфа</li><li>Скрыть текст, потому что он находится внутри элемента заголовка </li><br> Если поместить элемент HTML, такой как <h1> или , внутрь элемента head, как в этом случае, большинство браузеров его выведут, даже если это незаконно.<br>Должны ли браузеры прощать подобные ошибки? Наверно, это неправильно.<br><table border=1>Теги заголовка<tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top"><head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/></td><td bgcolor="#eaeaea" valign="top">Определяет информацию о документе</td></tr><tr><td bgcolor="#eaeaea" valign="top"><title></td><td bgcolor="#eaeaea" valign="top">Определяет заглавие документа</td></tr><tr><td bgcolor="#eaeaea" valign="top"><base></td><td bgcolor="#eaeaea" valign="top">Определяет базовый URL для всех ссылок на странице</td></tr><tr><td bgcolor="#eaeaea" valign="top"><link></td><td bgcolor="#eaeaea" valign="top">Определяет ссылку на ресурс</td></tr><tr><td bgcolor="#eaeaea" valign="top"><meta></td><td bgcolor="#eaeaea" valign="top">Определяет мета-информацию</td></tr><tr><td bgcolor="#eaeaea" valign="top"><!DOCTYPE></td><td bgcolor="#eaeaea" valign="top">Определяет тип документа. Этот тег идет перед начальным тегом <html>.</td></tr></table><br><br> <h1>Как использовать стили</h1> Когда браузер считывает таблицу стилей, он форматирует документ согласно этой таблице. Существует три способа использования таблицы стилей.<br><br> <h1>Как работать со старыми браузерами</h1> Браузер, который вообще не распознает тег <script>, будет выводить содержимое тега <script> в виде текста на странице. Чтобы браузер этого не делал, необходимо спрятать сценарий в тегах комментария. Старый браузер (который не распознает тег <script>) проигнорирует комментарий и не будет выводить содержимое тега на странице, в то время как более новые браузеры поймут, что скрипт необходимо выполнить, даже если он окружен тегами комментария.<br>JavaScript:<br> <script type="text/javascript">  </script><br> VBScript:<br> <script type="text/vbscript">  </script><br><br> <h1>Каскадные таблицы стилей (CSS)</h1> CSS используются для одновременного управления стилями и компоновкой множества страниц Web. Используя CSS Вам не придется раз за разом описывать внешний вид одинаковых элементов, и постоянно держать в голове их описание, достаточно сделать это один раз в отдельном, файле и подключить его ко всем гипертекстовым страницам, и браузер сам отформатирует текст в соответствии с вашими рекомендациями.<br>CSS обеспечивает полный контроль за компоновкой, не теряя при этом содержимое документа. Иными словами, в html файле хранится только логическая структура документа, а все оформление вынесено в отдельный документ. И если вдруг возникнет необходимость изменить внешний вид какого-либо элемента, уже не придется править все страницы сайта, а достаточно будет лишь изменить описание в таблице стилей.<br><br> <h1>Компоновка документа в HTML</h1> Выше были рассмотрены основные теги HTML. Используя их уже можно создавать свои страницы. Но создание страницы это не только верстка материалов, но и компоновка всех элементов (меню, заголовок страницы, основное информационное наполнение, банеры и др.) на странице HTML документа. Если все элементы должны располагаться один за другим тогда понятно как поступить - размещаем все блоки последовательно друг за другом и получаем результат. А как быть если два элемента должны размещаться на одном уровне по горизонтали? Например, меню должно находиться слева или справа от текста? Ответ очевиден, использовать свойство HTML тегов, позволяющее вкладывать один тег в другой.<br>Наиболее распространенным способом компоновки страницы является использование таблиц. Ниже будет рассмотрен этот способ.<br><br> <h1>Компоновка HTML - использование таблиц</h1> Как известно тег <table> используется для отображения таблиц в HTML документах. У этого тега имеется атрибут border, указывающий толщину границы. И если его значение равно нулю, то граница не видна, видно лишь содержимое ячеек. Это и используется для компановки страниц. В распоряжении дизайнера появляется не одна большая область для вставки элементов, а бесконечное число более мелких зон.<br>Наберите следующий пример.<br> <html> <body> Часть этой страницы отформатирована с помощью двух столбцов, как газетная страница. Все что находится ниже этого текста располагается в двух ячейках таблицы. Как можно видеть, есть левый столбец и правый столбец.<br> <table border="0" width="100%"> <tr><td width="50%" valign="top">Этот текст выводится в левом столбце.</td><td width="50%" valign="top">А этот текст выводится в правом столбце.</td></tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br>В этом примере тег HTML <table> используется для деления части Web-страницы на два столбца, причем в данном случае ширина столбцов одинакова. Однако это не является обязательным условием, что показано в следующем примере.<br> <html> <body> Часть этой страницы отформатирована с помощью двух столбцов, как газетная страница. Все что находиться ниже этого текста располагается в двух ячейках таблицы. Как можно видеть, есть левый столбец и правый столбец.<br> <table border="0" width="100%"> <tr><td width="20%" valign="top">Этот текст выводится в левом столбце. Ширина этого столбца 20%</td><td width="80%" valign="top">А этот текст выводится в правом столбце. Ширина столбца 80%</td></tr> </table> </body> </html><br> Пример выполнения данного HTML-кода<br>Особенность состоит в использовании таблицы без видимой рамки и возможно небольшого дополнительного отступа внутри ячеек таблицы.<br>Не имеет значения сколько текста будет размещено на этой странице, он будет оставаться в пределах своего столбца.<br>После добавления таблицы для разметки страницы мы получаем несколько независимых областей с которыми мы можем работать независимо, задавать цвет фона шрифты, добавлять вложеные таблицы для разбиения ячеек полученой части еще на более мелкие элементы. Однако создавать большую вложенность таблиц не рекомендуется - так увеличивается размер страницы. Гораздо рациональнее использовать объединение ячеек.<br> <br> <html> <body> Часть этой страницы отформатирован с помощью двух столбцов, как газетная страница, и общего заголовка. Все что находиться ниже этого текста располагается в трех ячейках таблицы, причем для верхней ячейки указан атрибут colspan="2". Как можно видеть, есть левый столбец и правый столбец, а также общий заголовок. Для каждой ячеки указан свой цвет фона.<br> <table border="0" width="100%" cellpadding="0" cellspacing="0"> <tr height="150px"><td width="100%" valign="top" colspan="2" bgcolor="#cccccc"> Этот текст выводится в верхней ячейке таблицы.</td></tr> <tr height="500px"><td width="20%" valign="top" bgcolor="#dddddd"> Этот текст выводится в левом столбце. Ширина этого столбца 20%</td><td width="80%" valign="top" bgcolor="#eeeeeee">А этот текст выводится в правом столбце. Ширина столбца 80%</td></tr> </table> </body> </html><br><br> Пример выполнения данного HTML-кода<br><br>Этот же эффект можно получить и применив две таблицы вложенных одна в другую.<br><br> <html> <body> Часть этой страницы отформатирован с помощью двух столбцов, как газетная страница, и общего заголовка. Все что находиться ниже этого текста располагается в ячейках таблицы, причем здесь применяется вложенностть одной таблицы в другую. Как можно видеть, есть левый столбец и правый столбец, а также общий заголовок. Для каждой ячеки указан свой цвет фона.<br><br><br> <table border="0" width="100%" cellpadding="0" cellspacing="0"> <tr height="150px"><td width="100%" valign="top" bgcolor="#cccccc"> Этот текст выводится в верхней ячейке таблицы.</td></tr><br><br> <tr height="500px"><td width="100%"> <table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0"> <tr><td width="20%" valign="top" bgcolor="#dddddd"> Этот текст выводится в левом столбце. Ширина этого столбца 20%</td><td width="80%" valign="top" bgcolor="#eeeeeee"> А этот текст выводится в правом столбце. Ширина столбца 80%</td></tr></table> </td></tr> </table><br><br></body> </html><br><br> Пример выполнения данного HTML-кода<br><br>Как можно видеть мы получили одинаковый результат, однако в первом случае размер кода получился значительно меньше, и кроме того сам исходный код более понятен.<br><br> <h1>Краткое заключение</h1> Этот учебник научил вас, как использовать HTML для создания своего собственного Web-сайта. Еще лет десять назад, этих знаний было бы достаточно, но в современных условиях это уже не так. Если вы посмотрите на любой популярный сайт в сети, то можете заметить, что зачастую на сайте присутствуют не только статические элементы языка html, но различные динамические элементы, flash-клипы, сценарии, и много другое, что украшает сайт, делает его более удобным. Если вы хотите сделать небольшой сайт рассказывающий о себе, этих знаний будет достаточно, но для того чтобы работать профессионально, вам придется изучить еще очень многое.<br>HTML является универсальным языком разметки для Web. Он позволяет форматировать текст, добавлять графику, создавать ссылки, формы ввода, фреймы, и т.д. и сохранять все это в текстовом файле, который может прочитать и воспроизвести любой браузер.<br>Ключевым моментом в HTML являются теги, которые указывают, какое далее следует содержимое.<br><br> <h1>Мета-информация в HTML</h1> Описание документа<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/><br> <meta name="author" content="Иван Петров"> <meta name="revised" content="Иван Петров,16/10/05"> <meta name="generator" content="Microsoft FrontPage 4.0"><br> </head> <body> Атрибуты meta этого документа определяют автора и использованную программу редактора.<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Информация внутри элемента meta описывает документ.<br>Ключевые слова документа<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/><br> <meta name="description" content="примеры HTML"> <meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript"><br> </head> <body> Атрибуты meta этого документа описывают документ и его ключевые слова.<br> </body> </html><br> Пример выполнения данного HTML-кода<br>Информация внутри элемента meta описывает ключевые слова документа.<br>Перенаправление пользователя<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <meta http-equiv="Refresh" content="5;url=http://www.intuit.ru"> </head><br> <body> Извините! Мы переехали! Новый URL: <a href="http://www.intuit.ru">http://www.osp.ru</a> <br><br> Вы будете перенаправлены на новый адрес через пять секунд. <br><br> Если вы видите это сообщение более 5 секунд, щелкните, пожалуйста, на приведенной выше ссылке ссылке! <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как перенаправить пользователя, если адрес сайта изменился.<br>Элемент meta<br>Как было показано в предыдущей лекции, элемент head содержит общую информацию (мета-информацию) о документе.<br>HTML имеет также элемент meta, который помещается внутри элемента head. Элемент meta предназначен для предоставления мета-информации о документе.<br>Наиболее часто элемент meta используется для предоставления информации, которая имеет отношение к браузерам или поисковым машинам, описывающая содержание документа.<br>Примечание: Консорциум W3C заявляет в документе http://www.w3.org/TR/html4/struct/global.html#adef-http-equiv, что "Некоторые агенты пользователей поддерживают использование META для обновления текущей страницы после указанного количества секунд, с возможностью заменить ее другим URI. Авторы не должны использовать эту технику для пересылки пользователей на другие страницы, так как это делает страницу недоступной для некоторых пользователей. Вместо этого автоматическое перенаправление страницы должно делаться с помощью перенаправления на сервере".<br>Ключевые слова для поисковых машин<br>Некоторые поисковые машины в WWW будут использовать атрибуты name и content тега meta для индексации страницы.<br>Этот элемент meta определяет описание страницы:<br> <br> <meta name="description" content="Бесплатные Web- учебники по HTML, CSS, XML, и XHTML"><br><br> Этот элемент meta определяет ключевые слова для страницы:<br><br> <meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript"><br><br> Назначение атрибутов name и content состоит в описании содержимого страницы. <br><br>Однако, так как многие вебмастера использовали теги meta для недобросовестной рекламы, увеличивая количество повторений ключевых слов, чтобы страница получила более высокое положение, некоторые машины поиска полностью перестали использовать этот тег.<br><br>О машинах поиска можно почитать в учебнике по созданию Web-сайтов.<br><br>Неизвестные атрибуты meta<br><br>Иногда можно встретить атрибуты meta, которые могут оказаться совершенно незнакомыми, например:<br><br> <meta name="security" content="low"><br><br> Тогда необходимо просто принять для себя, что это является чем-то уникальным для сайта или для автора сайта и не имеет, вероятно, к вам никакого отношення.<br><br>Весь список атрибутов элемента meta можно найти в Полном справочнике тегов HTML 4.01 в конце книги.<br><br> <h1>с помощью двух столбцов, как </h1> Часть этой страницы отформатирована с помощью двух столбцов, как газетная страница. Все что находиться ниже этого текста располагается в двух ячейках таблицы. Как можно видеть, есть левый столбец и правый столбец.<br> <table border=1><br> <tr><td>Этот текст выводиться в левом столбце.</td><td>А этот текст выводиться в правом столбце.</td></tr> </table> <h1>Раздел заголовка HTML</h1> Заглавие документа<br> <html><br> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <title>Название документа не выводится</title> </head><br> <body> Выводится этот текст<br> </body><br> </html><br> Пример выполнения данного HTML-кода<br>Информация о названии документа в элементе заголовка не выводится в окне браузера.<br>Одно место назначения для всех ссылок<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <base target="_blank"> </head><br> <body><br> <a href="http://www.intuit.ru" target="_blank">Эта ссылка </a> будет загружаться в новом окне, так как атрибут target задан как "_blank". <br><br> <a href="http://www.osp.ru"> Эта ссылка</a> также будет загружаться в новом окне, даже без атрибута target. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как использовать тег base, чтобы все ссылки на странице открывались в новом окне.<br><br> <h1>Сценарии в HTML</h1> Сценарии на страницах HTML позволяют сделать их более динамичными и интерактивными.<br> <html> <body><br> <script type="text/javascript"> document.write("<h1>Всем привет!</h1>") </script><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как использовать сценарий в документе HTML.<br>Работа с браузерами, не поддерживающими сценарии<br> <html> <body><br> <script type="text/javascript">  </script><br> <noscript>Нет поддержки JavaScript!</noscript><br> Браузер без поддержки JavaScript выведет текст из элемента noscript. <br><br> </body> </html><br> Пример выполнения данного HTML-кода<br>Этот пример показывает, как работать с браузерами, которые не поддерживают сценарии.<br><br> <h1>Схемы обращения к ресурсу URL</h1> Несколько примеров наиболее распространенных схем обращения к ресурсу:<br><table border=1><tr>СхемаДоступ</tr><tr><td bgcolor="#eaeaea" valign="top">file</td><td bgcolor="#eaeaea" valign="top">файл на локальном ПК</td></tr><tr><td bgcolor="#eaeaea" valign="top">ftp</td><td bgcolor="#eaeaea" valign="top">файл на сервере FTP</td></tr><tr><td bgcolor="#eaeaea" valign="top">http</td><td bgcolor="#eaeaea" valign="top">файл на сервере WWW</td></tr><tr><td bgcolor="#eaeaea" valign="top">gopher</td><td bgcolor="#eaeaea" valign="top">файл на сервере Gopher</td></tr><tr><td bgcolor="#eaeaea" valign="top">news</td><td bgcolor="#eaeaea" valign="top">группа новостей Usenet</td></tr><tr><td bgcolor="#eaeaea" valign="top">telnet</td><td bgcolor="#eaeaea" valign="top">соединение Telnet</td></tr><tr><td bgcolor="#eaeaea" valign="top">WAIS</td><td bgcolor="#eaeaea" valign="top">файл на сервере WAIS</td></tr></table><br> Доступ к группе новостей. Следующий код HTML:<br> <a href="news:alt.html">HTML Newsgroup</a><br> создает ссылку на группу новостей вида "HTML Newsgroup".<br>Загрузка с помощью FTP. Следующий код HTML:<br> <a href="ftp://www.osp.ru/ftp/winzip.exe">Загрузить WinZip</a><br> создает ссылку для загрузки файла следующего вида: "Загрузить WinZip". (Эта ссылка не работает. Это просто пример.)<br>Ссылка на почтовую систему. Следующий код HTML:<br> <a href="mailto:info@intuit.ru">info@intuit.ru</a><br> создает ссылку на вашу собственную почтовую систему.<br><br> <h1>Ссылки в HTML</h1> Во время щелчка мышью на ссылке в документе HTML нижележащий тег <a> указывает на определенное место (адрес) в Web с помощью значения атрибута href, например, следующим образом:<br> <a href="lastpage.htm">Последняя</a>.<br> Ссылка "Последняя" в этом примере является ссылкой относительно Web-сайта, который вы просматриваете, а браузер создаст для доступа к странице полный адрес Web вида http://www.osp.ru/html/lastpage.htm.<br><br> <h1>Теги HTML могут иметь атрибуты. </h1> Теги HTML могут иметь атрибуты. Специальные атрибуты для каждого тега перечислены в описании каждого тега, Перечисленные здесь атрибуты являются базовыми и атрибутами языка, которые стандартны для всех тегов (с небольшими исключениями):<br><br> <h1>Тег <noscript></h1> Кроме скрытия сценария внутри комментария можно добавить также тег <noscript>.<br>Тег <noscript> используется для определения заменяющего текста, если сценарий НЕ выполняется. Этот тег используется для браузеров, которые распознают тег <script>, но не поддерживают расположенный внутри сценарий, поэтому эти браузеры будут выводить вместо этого текст внутри тега <noscript>. Однако, если браузер поддерживает сценарий внутри тега <script>, то он проигнорирует тег <noscript>.<br>JavaScript:<br> <script type="text/javascript">  </script> <noscript>Ваш браузер не поддерживает JavaScript!</noscript><br> VBScript:<br> <script type="text/vbscript">  </script> <noscript>Ваш браузер не поддерживает VBScript!</noscript> <table border=1>Теги сценариев<tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top"><script></td><td bgcolor="#eaeaea" valign="top">Определяет сценарий </td></tr><tr><td bgcolor="#eaeaea" valign="top"><noscript></td><td bgcolor="#eaeaea" valign="top">Определяет заменяющий текст, если сценарий не выполняется</td></tr><tr><td bgcolor="#eaeaea" valign="top"><object></td><td bgcolor="#eaeaea" valign="top">Определяет встроенный объект</td></tr><tr><td bgcolor="#eaeaea" valign="top"><param></td><td bgcolor="#eaeaea" valign="top">Определяет для объекта настройки времени выполнения (параметры)</td></tr><tr><td bgcolor="#eaeaea" valign="top"><applet></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого <object></td></tr></table><br><br> <h1>Теперь вы знаете HTML, что дальше?</h1> Следующим шагом должно стать изучение XHTML и CSS, а также следует обратить внимание на JavaScript и VBscript.<br><br> <h1>Универсальные указатели ресурсов</h1> Для адресации документа (или других данных) в WWW используется так называемый Универсальный указатель ресурса (URL - Uniform Resource Locator). Полный адрес в Web, такой как http://www.osp.ru/html/lastpage.htm следует следующим правилам синтаксиса:<br> scheme://host.domain:port/path/filename <li>scheme определяет тип службы Интернет. Наиболее распространенным типом является http.</li><li>domain определяет имя домена Интернет, например, osp.ru.</li><li>host определяет хост домена. Если он отсутствует, то по умолчанию для http используется хост www.</li><li>:port определяет номер порта на хосте. Номер порта обычно отсутствует. По умолчанию для http используется порт с номером 80.</li><li>path определяет путь доступа (подкаталог) на сервере. Если путь доступа отсутствует, то ресурс (документ) должен быть расположен в корневом каталоге сайта Web.</li><li>filename определяет имя документа. По умолчанию может использоваться имя файла default.asp, или index.html или что-то еще, в зависимости от настроек Web-сервера.</li><br><br> <h1>Внешняя таблица стилей</h1> Внешняя таблица стилей является идеальной, когда стиль применяется к нескольким страницам. С помощью внешней таблицы стилей можно изменить внешний вид всего Web-сайта, изменяя один файл. Каждая страница должна соединяться с таблицей стилей с помощью тега <link>. Тег <link> находится в разделе заголовка <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/>.<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Внутренняя таблица стилей</h1> Внутренняя таблица стилей должна использоваться, когда один документ использует единый стиль. Внутренние стили определяют в разделе заголовка с помощью тега <style>.<br> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <style type="text/css"> body {background-color: red} p {margin-left: 20px} </style> </head> </html><br> Пример выполнения данного HTML-кода<br><br> <h1>Встроенные стили</h1> Встроенный стиль должен использоваться, когда особый стиль должен быть применен к единственному появлению элемента.<br>Чтобы использовать встроенные стили, используется атрибут style в соответствующем теге. Атрибут style может содержать любое свойство CSS. Следующий пример показывает, как изменить цвет и левое поле параграфа:<br> <html> <body> <p style="color: red; margin-left: 20px"> Это параграф <br> </body> </html><br> Пример выполнения данного HTML-кода<br>Чтобы больше узнать о стилях, почитайте учебник о CSS.<br><table border=1>Теги стилей<tr>ТегОписание</tr><tr><td bgcolor="#eaeaea" valign="top">Тег</td><td bgcolor="#eaeaea" valign="top">Описание</td></tr><tr><td bgcolor="#eaeaea" valign="top"><style></td><td bgcolor="#eaeaea" valign="top">Задает определение стиля</td></tr><tr><td bgcolor="#eaeaea" valign="top"><link></td><td bgcolor="#eaeaea" valign="top">Задает ссылку на ресурс</td></tr><tr><td bgcolor="#eaeaea" valign="top"><div></td><td bgcolor="#eaeaea" valign="top">Определяет раздел в документе</td></tr><tr><td bgcolor="#eaeaea" valign="top"><span></td><td bgcolor="#eaeaea" valign="top">Определяет раздел в документе</td></tr><tr><td bgcolor="#eaeaea" valign="top"><font></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого стили.</td></tr><tr><td bgcolor="#eaeaea" valign="top"><basefont></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого стили.</td></tr><tr><td bgcolor="#eaeaea" valign="top"><center></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Используйте вместо этого стили.</td></tr></table><br><br> <h1>XHTML</h1> XHTML является "новым" HTML. Самыми последними рекомендациями по HTML является версия HTML 4.01. Это последняя и окончательная версия HTML.<br>HTML будет заменен XHTML, который является более строгой и четкой версией HTML.<br><br> <h1> Основы работы с HTML </h1> <h1>Другие элементы</h1> <br> <blockquote> Текстовая цитата из некоторого источника. </blockquote><br> <address> Город <br> Адрес 1<br> Адрес 2<br> </address><br><br> <h1>Физические стили</h1> <b>Этот текст жирный</b> <i>Этот текст наклонный</i><br><br> <h1>Формы</h1> <form action="http://www.example.com/test.asp" method="post/get"> <br> <input type="text" name="lastname" value="Петров" size="30" maxlength="50"> <input type="password"> <input type="checkbox" checked="checked"> <input type="radio" checked="checked"> <input type="submit"> <input type="reset"> <input type="hidden"><br> <select> <option>Яблоки <option selected>Бананы <option>Вишня </select><br> <textarea name="Комментарии" rows="60" cols="20"></textarea><br> </form><br><br> <h1>Фреймы</h1> <frameset cols="25%,75%"> <frame src="page1.htm"> <frame src="page2.htm"> </frameset><br><br> <h1>Элементы текста</h1> Это параграф<br> <br> (перенос строки) <hr> (горизонтальная линейка) <pre>Этот текст заранее отформатирован</pre><br><br> <h1>Элементы заголовка</h1> <h1>Самый крупный заголовок</h1> <h2> . . . </h2> <h3> . . . </h3> <h4> . . . </h4> <h5> . . . </h5> <h6>Самый мелкий заголовок</h6><br><br> <h1>Логические стили</h1> <em>Этот текст выделен </em> <strong>Этот текст акцентирован</strong> <code>Это некоторый программный код</code><br><br> <h1>Неупорядоченный список</h1> <li>Первый элемент</li> <li>Следующий элемент</li> <br><br> <h1>Символьные объекты</h1> < то же самое что < > то же самое что > © то же самое что ©<br><br> <h1>Список определений</h1> <dl> <dt>Первый термин</dt> <dd>Определение</dd> <dt>Следующий термин</dt> <dd>Определение</dd> </dl><br><br> <h1>Ссылки, анкеры, и элементы изображений</h1> <a href="http://www.example.com/">Это ссылка</a> <a href="http://www.example.com/"><img src="URL" alt="заменяющий текст"></a> <a href="mailto:webmaster@example.com">Пошлите e-mail</a><br> Именованный анкер: <a name="tips">Раздел полезных советов</a> <a href="#tips">Переход в Раздел полезных советов</a><br><br> <h1>Структура документа HTML</h1> <html> <head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/> <title>Здесь находится название документа</title> </head> <body> Здесь находится выводимый текст </body> <br> </html><br><br> <h1>Таблицы</h1> <table border="1"> <tr> <th>какой-то заголовок</th> <th>какой-то заголовок</th> </tr> <tr> <td>какой-то текст</td> <td>какой-то текст</td> </tr> </table><br><br> <h1>Упорядоченный список</h1> <li>Первый элемент</li> <li>Следующий элемент</li> <br><br> <h1> Основы работы с HTML </h1> <h1>Кодировка URL от %00 до %8f</h1> <table border=1><tr>ASCIIКод URLASCIIКод URLASCIIКод URL</tr><tr><td bgcolor="#eaeaea" valign="top">ж</td><td bgcolor="#eaeaea" valign="top">%00</td><td bgcolor="#eaeaea" valign="top">0</td><td bgcolor="#eaeaea" valign="top">%30</td><td bgcolor="#eaeaea" valign="top">`</td><td bgcolor="#eaeaea" valign="top">%60</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%01</td><td bgcolor="#eaeaea" valign="top">1</td><td bgcolor="#eaeaea" valign="top">%31</td><td bgcolor="#eaeaea" valign="top">a</td><td bgcolor="#eaeaea" valign="top">%61</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%02</td><td bgcolor="#eaeaea" valign="top">2</td><td bgcolor="#eaeaea" valign="top">%32</td><td bgcolor="#eaeaea" valign="top">b</td><td bgcolor="#eaeaea" valign="top">%62</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%03</td><td bgcolor="#eaeaea" valign="top">3</td><td bgcolor="#eaeaea" valign="top">%33</td><td bgcolor="#eaeaea" valign="top">c</td><td bgcolor="#eaeaea" valign="top">%63</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%04</td><td bgcolor="#eaeaea" valign="top">4</td><td bgcolor="#eaeaea" valign="top">%34</td><td bgcolor="#eaeaea" valign="top">d</td><td bgcolor="#eaeaea" valign="top">%64</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%05</td><td bgcolor="#eaeaea" valign="top">5</td><td bgcolor="#eaeaea" valign="top">%35</td><td bgcolor="#eaeaea" valign="top">e</td><td bgcolor="#eaeaea" valign="top">%65</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%06</td><td bgcolor="#eaeaea" valign="top">6</td><td bgcolor="#eaeaea" valign="top">%36</td><td bgcolor="#eaeaea" valign="top">f</td><td bgcolor="#eaeaea" valign="top">%66</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%07</td><td bgcolor="#eaeaea" valign="top">7</td><td bgcolor="#eaeaea" valign="top">%37</td><td bgcolor="#eaeaea" valign="top">g</td><td bgcolor="#eaeaea" valign="top">%67</td></tr><tr><td bgcolor="#eaeaea" valign="top">backspace</td><td bgcolor="#eaeaea" valign="top">%08</td><td bgcolor="#eaeaea" valign="top">8</td><td bgcolor="#eaeaea" valign="top">%38</td><td bgcolor="#eaeaea" valign="top">h</td><td bgcolor="#eaeaea" valign="top">%68</td></tr><tr><td bgcolor="#eaeaea" valign="top">tab</td><td bgcolor="#eaeaea" valign="top">%09</td><td bgcolor="#eaeaea" valign="top">9</td><td bgcolor="#eaeaea" valign="top">%39</td><td bgcolor="#eaeaea" valign="top">i</td><td bgcolor="#eaeaea" valign="top">%69</td></tr><tr><td bgcolor="#eaeaea" valign="top">linefeed</td><td bgcolor="#eaeaea" valign="top">%0a</td><td bgcolor="#eaeaea" valign="top">:</td><td bgcolor="#eaeaea" valign="top">%3a</td><td bgcolor="#eaeaea" valign="top">j</td><td bgcolor="#eaeaea" valign="top">%6a</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%0b</td><td bgcolor="#eaeaea" valign="top">;</td><td bgcolor="#eaeaea" valign="top">%3b</td><td bgcolor="#eaeaea" valign="top">k</td><td bgcolor="#eaeaea" valign="top">%6b</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%0c</td><td bgcolor="#eaeaea" valign="top"><</td><td bgcolor="#eaeaea" valign="top">%3c</td><td bgcolor="#eaeaea" valign="top">l</td><td bgcolor="#eaeaea" valign="top">%6c</td></tr><tr><td bgcolor="#eaeaea" valign="top">c return</td><td bgcolor="#eaeaea" valign="top">%0d</td><td bgcolor="#eaeaea" valign="top">=</td><td bgcolor="#eaeaea" valign="top">%3d</td><td bgcolor="#eaeaea" valign="top">m</td><td bgcolor="#eaeaea" valign="top">%6d</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%0e</td><td bgcolor="#eaeaea" valign="top">></td><td bgcolor="#eaeaea" valign="top">%3e</td><td bgcolor="#eaeaea" valign="top">n</td><td bgcolor="#eaeaea" valign="top">%6e</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%0f</td><td bgcolor="#eaeaea" valign="top">?</td><td bgcolor="#eaeaea" valign="top">%3f</td><td bgcolor="#eaeaea" valign="top">o</td><td bgcolor="#eaeaea" valign="top">%6f</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%10</td><td bgcolor="#eaeaea" valign="top">@</td><td bgcolor="#eaeaea" valign="top">%40</td><td bgcolor="#eaeaea" valign="top">p</td><td bgcolor="#eaeaea" valign="top">%70</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%11</td><td bgcolor="#eaeaea" valign="top">A</td><td bgcolor="#eaeaea" valign="top">%41</td><td bgcolor="#eaeaea" valign="top">q</td><td bgcolor="#eaeaea" valign="top">%71</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%12</td><td bgcolor="#eaeaea" valign="top">B</td><td bgcolor="#eaeaea" valign="top">%42</td><td bgcolor="#eaeaea" valign="top">r</td><td bgcolor="#eaeaea" valign="top">%72</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%13</td><td bgcolor="#eaeaea" valign="top">C</td><td bgcolor="#eaeaea" valign="top">%43</td><td bgcolor="#eaeaea" valign="top">s</td><td bgcolor="#eaeaea" valign="top">%73</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%14</td><td bgcolor="#eaeaea" valign="top">D</td><td bgcolor="#eaeaea" valign="top">%44</td><td bgcolor="#eaeaea" valign="top">t</td><td bgcolor="#eaeaea" valign="top">%74</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%15</td><td bgcolor="#eaeaea" valign="top">E</td><td bgcolor="#eaeaea" valign="top">%45</td><td bgcolor="#eaeaea" valign="top">u</td><td bgcolor="#eaeaea" valign="top">%75</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%16</td><td bgcolor="#eaeaea" valign="top">F</td><td bgcolor="#eaeaea" valign="top">%46</td><td bgcolor="#eaeaea" valign="top">v</td><td bgcolor="#eaeaea" valign="top">%76</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%17</td><td bgcolor="#eaeaea" valign="top">G</td><td bgcolor="#eaeaea" valign="top">%47</td><td bgcolor="#eaeaea" valign="top">w</td><td bgcolor="#eaeaea" valign="top">%77</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%18</td><td bgcolor="#eaeaea" valign="top">H</td><td bgcolor="#eaeaea" valign="top">%48</td><td bgcolor="#eaeaea" valign="top">x</td><td bgcolor="#eaeaea" valign="top">%78</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%19</td><td bgcolor="#eaeaea" valign="top">I</td><td bgcolor="#eaeaea" valign="top">%49</td><td bgcolor="#eaeaea" valign="top">y</td><td bgcolor="#eaeaea" valign="top">%79</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%1a</td><td bgcolor="#eaeaea" valign="top">J</td><td bgcolor="#eaeaea" valign="top">%4a</td><td bgcolor="#eaeaea" valign="top">z</td><td bgcolor="#eaeaea" valign="top">%7a</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%1b</td><td bgcolor="#eaeaea" valign="top">K</td><td bgcolor="#eaeaea" valign="top">%4b</td><td bgcolor="#eaeaea" valign="top">{</td><td bgcolor="#eaeaea" valign="top">%7b</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%1c</td><td bgcolor="#eaeaea" valign="top">L</td><td bgcolor="#eaeaea" valign="top">%4c</td><td bgcolor="#eaeaea" valign="top">|</td><td bgcolor="#eaeaea" valign="top">%7c</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%1d</td><td bgcolor="#eaeaea" valign="top">M</td><td bgcolor="#eaeaea" valign="top">%4d</td><td bgcolor="#eaeaea" valign="top">}</td><td bgcolor="#eaeaea" valign="top">%7d</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%1e</td><td bgcolor="#eaeaea" valign="top">N</td><td bgcolor="#eaeaea" valign="top">%4e</td><td bgcolor="#eaeaea" valign="top">~</td><td bgcolor="#eaeaea" valign="top">%7e</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%1f</td><td bgcolor="#eaeaea" valign="top">O</td><td bgcolor="#eaeaea" valign="top">%4f</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%7f</td></tr><tr><td bgcolor="#eaeaea" valign="top">space</td><td bgcolor="#eaeaea" valign="top">%20</td><td bgcolor="#eaeaea" valign="top">P</td><td bgcolor="#eaeaea" valign="top">%50</td><td bgcolor="#eaeaea" valign="top">€</td><td bgcolor="#eaeaea" valign="top">%80</td></tr><tr><td bgcolor="#eaeaea" valign="top">!</td><td bgcolor="#eaeaea" valign="top">%21</td><td bgcolor="#eaeaea" valign="top">Q</td><td bgcolor="#eaeaea" valign="top">%51</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%81</td></tr><tr><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">%22</td><td bgcolor="#eaeaea" valign="top">R</td><td bgcolor="#eaeaea" valign="top">%52</td><td bgcolor="#eaeaea" valign="top">‚</td><td bgcolor="#eaeaea" valign="top">%82</td></tr><tr><td bgcolor="#eaeaea" valign="top">#</td><td bgcolor="#eaeaea" valign="top">%23</td><td bgcolor="#eaeaea" valign="top">S</td><td bgcolor="#eaeaea" valign="top">%53</td><td bgcolor="#eaeaea" valign="top">ѓ</td><td bgcolor="#eaeaea" valign="top">%83</td></tr><tr><td bgcolor="#eaeaea" valign="top">$</td><td bgcolor="#eaeaea" valign="top">%24</td><td bgcolor="#eaeaea" valign="top">T</td><td bgcolor="#eaeaea" valign="top">%54</td><td bgcolor="#eaeaea" valign="top">„</td><td bgcolor="#eaeaea" valign="top">%84</td></tr><tr><td bgcolor="#eaeaea" valign="top">%</td><td bgcolor="#eaeaea" valign="top">%25</td><td bgcolor="#eaeaea" valign="top">U</td><td bgcolor="#eaeaea" valign="top">%55</td><td bgcolor="#eaeaea" valign="top">…</td><td bgcolor="#eaeaea" valign="top">%85</td></tr><tr><td bgcolor="#eaeaea" valign="top">&</td><td bgcolor="#eaeaea" valign="top">%26</td><td bgcolor="#eaeaea" valign="top">V</td><td bgcolor="#eaeaea" valign="top">%56</td><td bgcolor="#eaeaea" valign="top">†</td><td bgcolor="#eaeaea" valign="top">%86</td></tr><tr><td bgcolor="#eaeaea" valign="top">'</td><td bgcolor="#eaeaea" valign="top">%27</td><td bgcolor="#eaeaea" valign="top">W</td><td bgcolor="#eaeaea" valign="top">%57</td><td bgcolor="#eaeaea" valign="top">‡</td><td bgcolor="#eaeaea" valign="top">%87</td></tr><tr><td bgcolor="#eaeaea" valign="top">(</td><td bgcolor="#eaeaea" valign="top">%28</td><td bgcolor="#eaeaea" valign="top">X</td><td bgcolor="#eaeaea" valign="top">%58</td><td bgcolor="#eaeaea" valign="top">€</td><td bgcolor="#eaeaea" valign="top">%88</td></tr><tr><td bgcolor="#eaeaea" valign="top">)</td><td bgcolor="#eaeaea" valign="top">%29</td><td bgcolor="#eaeaea" valign="top">Y</td><td bgcolor="#eaeaea" valign="top">%59</td><td bgcolor="#eaeaea" valign="top">‰</td><td bgcolor="#eaeaea" valign="top">%89</td></tr><tr><td bgcolor="#eaeaea" valign="top">*</td><td bgcolor="#eaeaea" valign="top">%2a</td><td bgcolor="#eaeaea" valign="top">Z</td><td bgcolor="#eaeaea" valign="top">%5a</td><td bgcolor="#eaeaea" valign="top">Љ</td><td bgcolor="#eaeaea" valign="top">%8a</td></tr><tr><td bgcolor="#eaeaea" valign="top">+</td><td bgcolor="#eaeaea" valign="top">%2b</td><td bgcolor="#eaeaea" valign="top">[</td><td bgcolor="#eaeaea" valign="top">%5b</td><td bgcolor="#eaeaea" valign="top">‹</td><td bgcolor="#eaeaea" valign="top">%8b</td></tr><tr><td bgcolor="#eaeaea" valign="top">,</td><td bgcolor="#eaeaea" valign="top">%2c</td><td bgcolor="#eaeaea" valign="top">\</td><td bgcolor="#eaeaea" valign="top">%5c</td><td bgcolor="#eaeaea" valign="top">Њ</td><td bgcolor="#eaeaea" valign="top">%8c</td></tr><tr><td bgcolor="#eaeaea" valign="top">-</td><td bgcolor="#eaeaea" valign="top">%2d</td><td bgcolor="#eaeaea" valign="top">]</td><td bgcolor="#eaeaea" valign="top">%5d</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%8d</td></tr><tr><td bgcolor="#eaeaea" valign="top">.</td><td bgcolor="#eaeaea" valign="top">%2e</td><td bgcolor="#eaeaea" valign="top">^</td><td bgcolor="#eaeaea" valign="top">%5e</td><td bgcolor="#eaeaea" valign="top">Ћ</td><td bgcolor="#eaeaea" valign="top">%8e</td></tr><tr><td bgcolor="#eaeaea" valign="top">/</td><td bgcolor="#eaeaea" valign="top">%2f</td><td bgcolor="#eaeaea" valign="top">_</td><td bgcolor="#eaeaea" valign="top">%5f</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%8f</td></tr></table><br><br> <h1>Кодировка URL от %90 до %ff</h1> <table border=1><tr>ASCIIКод URLASCIIКод URLASCIIКод URL</tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%90</td><td bgcolor="#eaeaea" valign="top">А</td><td bgcolor="#eaeaea" valign="top">%c0</td><td bgcolor="#eaeaea" valign="top">р</td><td bgcolor="#eaeaea" valign="top">%f0</td></tr><tr><td bgcolor="#eaeaea" valign="top">‘</td><td bgcolor="#eaeaea" valign="top">%91</td><td bgcolor="#eaeaea" valign="top">Б</td><td bgcolor="#eaeaea" valign="top">%c1</td><td bgcolor="#eaeaea" valign="top">с</td><td bgcolor="#eaeaea" valign="top">%f1</td></tr><tr><td bgcolor="#eaeaea" valign="top">’</td><td bgcolor="#eaeaea" valign="top">%92</td><td bgcolor="#eaeaea" valign="top">В</td><td bgcolor="#eaeaea" valign="top">%c2</td><td bgcolor="#eaeaea" valign="top">т</td><td bgcolor="#eaeaea" valign="top">%f2</td></tr><tr><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">%93</td><td bgcolor="#eaeaea" valign="top">Г</td><td bgcolor="#eaeaea" valign="top">%c3</td><td bgcolor="#eaeaea" valign="top">у</td><td bgcolor="#eaeaea" valign="top">%f3</td></tr><tr><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">%94</td><td bgcolor="#eaeaea" valign="top">Д</td><td bgcolor="#eaeaea" valign="top">%c4</td><td bgcolor="#eaeaea" valign="top">ф</td><td bgcolor="#eaeaea" valign="top">%f4</td></tr><tr><td bgcolor="#eaeaea" valign="top">•</td><td bgcolor="#eaeaea" valign="top">%95</td><td bgcolor="#eaeaea" valign="top">Е</td><td bgcolor="#eaeaea" valign="top">%c5</td><td bgcolor="#eaeaea" valign="top">х</td><td bgcolor="#eaeaea" valign="top">%f5</td></tr><tr><td bgcolor="#eaeaea" valign="top">–</td><td bgcolor="#eaeaea" valign="top">%96</td><td bgcolor="#eaeaea" valign="top">Ж</td><td bgcolor="#eaeaea" valign="top">%c6</td><td bgcolor="#eaeaea" valign="top">ц</td><td bgcolor="#eaeaea" valign="top">%f6</td></tr><tr><td bgcolor="#eaeaea" valign="top">—</td><td bgcolor="#eaeaea" valign="top">%97</td><td bgcolor="#eaeaea" valign="top">З</td><td bgcolor="#eaeaea" valign="top">%c7</td><td bgcolor="#eaeaea" valign="top">ч</td><td bgcolor="#eaeaea" valign="top">%f7</td></tr><tr><td bgcolor="#eaeaea" valign="top">_</td><td bgcolor="#eaeaea" valign="top">%98</td><td bgcolor="#eaeaea" valign="top">И</td><td bgcolor="#eaeaea" valign="top">%c8</td><td bgcolor="#eaeaea" valign="top">ш</td><td bgcolor="#eaeaea" valign="top">%f8</td></tr><tr><td bgcolor="#eaeaea" valign="top">™</td><td bgcolor="#eaeaea" valign="top">%99</td><td bgcolor="#eaeaea" valign="top">Й</td><td bgcolor="#eaeaea" valign="top">%c9</td><td bgcolor="#eaeaea" valign="top">щ</td><td bgcolor="#eaeaea" valign="top">%f9</td></tr><tr><td bgcolor="#eaeaea" valign="top">љ</td><td bgcolor="#eaeaea" valign="top">%9a</td><td bgcolor="#eaeaea" valign="top">К</td><td bgcolor="#eaeaea" valign="top">%ca</td><td bgcolor="#eaeaea" valign="top">ъ</td><td bgcolor="#eaeaea" valign="top">%fa</td></tr><tr><td bgcolor="#eaeaea" valign="top">›</td><td bgcolor="#eaeaea" valign="top">%9b</td><td bgcolor="#eaeaea" valign="top">Л</td><td bgcolor="#eaeaea" valign="top">%cb</td><td bgcolor="#eaeaea" valign="top">ы</td><td bgcolor="#eaeaea" valign="top">%fb</td></tr><tr><td bgcolor="#eaeaea" valign="top">њ</td><td bgcolor="#eaeaea" valign="top">%9c</td><td bgcolor="#eaeaea" valign="top">М</td><td bgcolor="#eaeaea" valign="top">%cc</td><td bgcolor="#eaeaea" valign="top">ь</td><td bgcolor="#eaeaea" valign="top">%fc</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%9d</td><td bgcolor="#eaeaea" valign="top">Н</td><td bgcolor="#eaeaea" valign="top">%cd</td><td bgcolor="#eaeaea" valign="top">э</td><td bgcolor="#eaeaea" valign="top">%fd</td></tr><tr><td bgcolor="#eaeaea" valign="top">ћ</td><td bgcolor="#eaeaea" valign="top">%9e</td><td bgcolor="#eaeaea" valign="top">О</td><td bgcolor="#eaeaea" valign="top">%ce</td><td bgcolor="#eaeaea" valign="top">ю</td><td bgcolor="#eaeaea" valign="top">%fe</td></tr><tr><td bgcolor="#eaeaea" valign="top">џ</td><td bgcolor="#eaeaea" valign="top">%9f</td><td bgcolor="#eaeaea" valign="top">П</td><td bgcolor="#eaeaea" valign="top">%cf</td><td bgcolor="#eaeaea" valign="top">я</td><td bgcolor="#eaeaea" valign="top">%ff</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%a0</td><td bgcolor="#eaeaea" valign="top">Р</td><td bgcolor="#eaeaea" valign="top">%d0</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Ў</td><td bgcolor="#eaeaea" valign="top">%a1</td><td bgcolor="#eaeaea" valign="top">С</td><td bgcolor="#eaeaea" valign="top">%d1</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">ў</td><td bgcolor="#eaeaea" valign="top">%a2</td><td bgcolor="#eaeaea" valign="top">Т</td><td bgcolor="#eaeaea" valign="top">%d2</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Ј</td><td bgcolor="#eaeaea" valign="top">%a3</td><td bgcolor="#eaeaea" valign="top">У</td><td bgcolor="#eaeaea" valign="top">%d3</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%a4</td><td bgcolor="#eaeaea" valign="top">Ф</td><td bgcolor="#eaeaea" valign="top">%d4</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Ґ</td><td bgcolor="#eaeaea" valign="top">%a5</td><td bgcolor="#eaeaea" valign="top">Х</td><td bgcolor="#eaeaea" valign="top">%d5</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">|</td><td bgcolor="#eaeaea" valign="top">%a6</td><td bgcolor="#eaeaea" valign="top">Ц</td><td bgcolor="#eaeaea" valign="top">%d6</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">§</td><td bgcolor="#eaeaea" valign="top">%a7</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">%d7</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Ё</td><td bgcolor="#eaeaea" valign="top">%a8</td><td bgcolor="#eaeaea" valign="top">Ш</td><td bgcolor="#eaeaea" valign="top">%d8</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">©</td><td bgcolor="#eaeaea" valign="top">%a9</td><td bgcolor="#eaeaea" valign="top">Щ</td><td bgcolor="#eaeaea" valign="top">%d9</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Є</td><td bgcolor="#eaeaea" valign="top">%aa</td><td bgcolor="#eaeaea" valign="top">Ъ</td><td bgcolor="#eaeaea" valign="top">%da</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">%ab</td><td bgcolor="#eaeaea" valign="top">Ы</td><td bgcolor="#eaeaea" valign="top">%db</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">¬</td><td bgcolor="#eaeaea" valign="top">%ac</td><td bgcolor="#eaeaea" valign="top">Ь</td><td bgcolor="#eaeaea" valign="top">%dc</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Ї</td><td bgcolor="#eaeaea" valign="top">%ad</td><td bgcolor="#eaeaea" valign="top">Э</td><td bgcolor="#eaeaea" valign="top">%dd</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">®</td><td bgcolor="#eaeaea" valign="top">%ae</td><td bgcolor="#eaeaea" valign="top">Ю</td><td bgcolor="#eaeaea" valign="top">%de</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Ї</td><td bgcolor="#eaeaea" valign="top">%af</td><td bgcolor="#eaeaea" valign="top">Я</td><td bgcolor="#eaeaea" valign="top">%df</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">°</td><td bgcolor="#eaeaea" valign="top">%b0</td><td bgcolor="#eaeaea" valign="top">а</td><td bgcolor="#eaeaea" valign="top">%e0</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">±</td><td bgcolor="#eaeaea" valign="top">%b1</td><td bgcolor="#eaeaea" valign="top">б</td><td bgcolor="#eaeaea" valign="top">%e1</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">І</td><td bgcolor="#eaeaea" valign="top">%b2</td><td bgcolor="#eaeaea" valign="top">в</td><td bgcolor="#eaeaea" valign="top">%e2</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">і</td><td bgcolor="#eaeaea" valign="top">%b3</td><td bgcolor="#eaeaea" valign="top">г</td><td bgcolor="#eaeaea" valign="top">%e3</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">ґ</td><td bgcolor="#eaeaea" valign="top">%b4</td><td bgcolor="#eaeaea" valign="top">д</td><td bgcolor="#eaeaea" valign="top">%e4</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">µ</td><td bgcolor="#eaeaea" valign="top">%b5</td><td bgcolor="#eaeaea" valign="top">е</td><td bgcolor="#eaeaea" valign="top">%e5</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">¶</td><td bgcolor="#eaeaea" valign="top">%b6</td><td bgcolor="#eaeaea" valign="top">ж</td><td bgcolor="#eaeaea" valign="top">%e6</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">•</td><td bgcolor="#eaeaea" valign="top">%b7</td><td bgcolor="#eaeaea" valign="top">з</td><td bgcolor="#eaeaea" valign="top">%e7</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">ё</td><td bgcolor="#eaeaea" valign="top">%b8</td><td bgcolor="#eaeaea" valign="top">и</td><td bgcolor="#eaeaea" valign="top">%e8</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">№</td><td bgcolor="#eaeaea" valign="top">%b9</td><td bgcolor="#eaeaea" valign="top">й</td><td bgcolor="#eaeaea" valign="top">%e9</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">є</td><td bgcolor="#eaeaea" valign="top">%ba</td><td bgcolor="#eaeaea" valign="top">к</td><td bgcolor="#eaeaea" valign="top">%ea</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">%bb</td><td bgcolor="#eaeaea" valign="top">л</td><td bgcolor="#eaeaea" valign="top">%eb</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">ј</td><td bgcolor="#eaeaea" valign="top">%bc</td><td bgcolor="#eaeaea" valign="top">м</td><td bgcolor="#eaeaea" valign="top">%ec</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">Ѕ</td><td bgcolor="#eaeaea" valign="top">%bd</td><td bgcolor="#eaeaea" valign="top">н</td><td bgcolor="#eaeaea" valign="top">%ed</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">ѕ</td><td bgcolor="#eaeaea" valign="top">%be</td><td bgcolor="#eaeaea" valign="top">о</td><td bgcolor="#eaeaea" valign="top">%ee</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">ї</td><td bgcolor="#eaeaea" valign="top">%bf</td><td bgcolor="#eaeaea" valign="top">п</td><td bgcolor="#eaeaea" valign="top">%ef</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td></tr></table><br><br> <h1> Основы работы с HTML </h1> <h1>Информационный сервер Интернет (IIS)</h1> Встроенный в Windows 2000 Web-сервер IIS облегчает создание больших приложений для Web. Как PWS, так и IIS включают ASP, стандарт серверных сценариев, которые можно использовать для создания динамических и интерактивных Web-приложений. IIS доступен также для Windows NT.<br>Дополнительно об ASP можно узнать в соответствующем учебнике.<br>Дополнительная информация об IIS находится в документации.<br><br> <h1>Как опубликовать свою работу?</h1> Отформатировать страницы сайта с помощью HTML это только половина работы, созданный сайт еще необходимо где-то разместить, чтобы он был доступен пользователям сети.<br><br> <h1>Как установить персональный Web-сервер (PWS):</h1> <li>Проверьте свою установку Windows, чтобы убедиться, что персональный сервер PWS не был уже установлен.</li><li>Если он не установлен, то установите PWS из каталога PWS на компакт-диске дистрибутива Windows.</li><li>Следуйте инструкциям по установке и запуску своего персонального Web-сервера.</li><br> Дополнительно о персональном Web-сервере PWS компании Microsoft можно прочитать в документации.<br>Примечание: Microsoft Windows XP Home Edition не имеет возможности превратить ваш компьютер в персональный Web-сервер!<br><br> <h1>Первый шаг: Персональный Web-сервер</h1> Ваш собственный ПК может действовать в качестве Web-сервера, если он соединен с сетью. Причем соединение с сетью должно быть высокоскоростным, а не через модем. И кроме того компьютер должен иметь реальный IP адрес, а не быть закрытым прокси-серверами.<br>В настоящее время существует большое количество Web-серверов. Для домашнего использования под операционной системой Windows подойдет один из серверов поставляемых на диске совместно с ОС. При работе в Windows 98 можно использовать PWS (Personal Web Server) -- Персональный Web-сервер. Он находиться в папке PWS компакт-диска дистрибутива Windows. А в Windows 2000 и XP можно использовать IIS.<br>Кроме того можно воспользоваться одним из продуктов сторонних разработчиков, например, сервером Apache. Данный продукт является бесплатным и на сегодняшний день этот сервер используется на большинстве web серверов по всему миру. Хотя установка этого сервера может быть выполнена также легко, как и серверов Microsoft, но настройка может оказаться для новичка затруднительной. Настройка сервера осуществляется путем правки конфигурационного файла. Поэтому здесь мы его рассматривать не будем, а остановимся на серверах IIS и PWS. Персональный Web-сервер (PWS)<br>PWS превращает любой компьютер с Windows в Web-сервер. PWS легко установить и он идеально подходит для разработки и тестирования Web-приложений. PWS был оптимизирован для использования на рабочих станциях, но удовлетворяет всем требованиям полноценного Web-сервера. Он поддерживает также Активные серверные страницы (ASP -- Active Server Pages), как и его старший брат IIS.<br><br> <h1>Следующий шаг: Профессиональный Web-сервер</h1> В настоящее время мало кто использует свой персональный компьютер в качестве web сервера. Это обуславливается, прежде всего, необходимостью наличия высококачественных каналов связи, необходимостью постоянного поддержания работоспособности сервера, боле тонкой настройкой безопасности системы. И как правило сайты на собственных web-серверах размещают только крупные организации, у которых имеются выделенные каналы Интернет и собственные выделенные сервера.<br>Остальные же обычно арендуют сервера у специализированных компаний, размещают сайты на бесплатных серверах или серверах своего провайдера Интернет. При этом один физический сервер обслуживает несколько web сайтов. Для небольших проектов этот вариант является оптимальным с точки зрения соотношения цены и объема предоставляемых услуг. В этом случае вы получаете доступ к частичной настройке своего виртуального сервера, как правило, это осуществляется через web интерфейс.<br>Для больших же проектов потребуется выделенный сервер, который будет отвечать только за один сайт, в этом случае у вас будет полный доступ по протоколу SSH к настройке всего сервера. Тут тоже имеется два варианта аренда сервера у хостинг-провайдера или покупка своего сервера и установка его в дата-центре хостера.<br><br> <h1> Основы работы с HTML </h1> <h1>По функциональным группам</h1> <li>NN: указывает самую раннюю версию Netscape, которая поддерживает этот тег</li><li>IE: указывает самую раннюю версию Internet Explorer, которая поддерживает этот тег</li><li>DTD: указывает в каком DTD XHTML 1.0 разрешен этот тег. S=Strict, T=Transitional, and F=Frameset</li><table border=1><tr>Начальный тегНазначениеNNIEDTD</tr><tr>Базовые теги</tr><tr><td bgcolor="#eaeaea" valign="top"><!DOCTYPE> </td><td bgcolor="#eaeaea" valign="top">Определяет тип документа </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><html></td><td bgcolor="#eaeaea" valign="top">Определяет документ html </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><body></td><td bgcolor="#eaeaea" valign="top">Определяет элемент тела </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><h1> -- <h6></td><td bgcolor="#eaeaea" valign="top">Определяет заголовки размера с 1 по 6 </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">Определяет параграф </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><br></td><td bgcolor="#eaeaea" valign="top">Вставляет перенос одной строки </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><hr></td><td bgcolor="#eaeaea" valign="top">Определяет горизонтальную линейку </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">Определяет комментарий </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr>Форматирование символов</tr><tr><td bgcolor="#eaeaea" valign="top"><b></td><td bgcolor="#eaeaea" valign="top">Определячет жирный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><font></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет шрифт, размер и цвет текста</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><i></td><td bgcolor="#eaeaea" valign="top">Определяет наклонный текст (курсив)</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><em></td><td bgcolor="#eaeaea" valign="top">Определяет выделенный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><big></td><td bgcolor="#eaeaea" valign="top">Определяет увеличенный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><strong></td><td bgcolor="#eaeaea" valign="top">Определяет акцентированный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><small></td><td bgcolor="#eaeaea" valign="top">Определяет уменьшенный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><sup></td><td bgcolor="#eaeaea" valign="top">Определяет текст как верхний индекс</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><sub></td><td bgcolor="#eaeaea" valign="top">Определяет текст как нижний индекс </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><bdo></td><td bgcolor="#eaeaea" valign="top">Определяет направление вывода текста </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">5.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><u></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет подчеркнутый текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr>Вывод</tr><tr><td bgcolor="#eaeaea" valign="top"><pre></td><td bgcolor="#eaeaea" valign="top">Определяет заранее отформатированный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><code></td><td bgcolor="#eaeaea" valign="top">Определяет текст кода программы </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tt></td><td bgcolor="#eaeaea" valign="top">Определяет текст телетайпа </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><kbd></td><td bgcolor="#eaeaea" valign="top">Определяет текст с клавиатуры</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><var></td><td bgcolor="#eaeaea" valign="top">Определяет переменную </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dfn></td><td bgcolor="#eaeaea" valign="top">Задает термин определения </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><samp></td><td bgcolor="#eaeaea" valign="top">Определяет образец программного кода</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><xmp></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет форматированный заранее текст</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr>Блоки</tr><tr><td bgcolor="#eaeaea" valign="top"><acronym></td><td bgcolor="#eaeaea" valign="top">Определяет акроним </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><abbr></td><td bgcolor="#eaeaea" valign="top">Определяет сокращение </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><address></td><td bgcolor="#eaeaea" valign="top">Определяет элемент адреса </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><blockquote></td><td bgcolor="#eaeaea" valign="top">Определяет длинную цитату </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><center></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет центрированный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><q></td><td bgcolor="#eaeaea" valign="top">Определяет короткую цитату </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><cite></td><td bgcolor="#eaeaea" valign="top">Определяет цитату </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><ins></td><td bgcolor="#eaeaea" valign="top">Определяет вставленный текст </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><del></td><td bgcolor="#eaeaea" valign="top">Определяет удаленный текст </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><s></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет зачеркнутый текст. </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><strike></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет зачеркнутый текст</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr>Ссылки</tr><tr><td bgcolor="#eaeaea" valign="top"><a></td><td bgcolor="#eaeaea" valign="top">Определяет анкер </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><link></td><td bgcolor="#eaeaea" valign="top">Определяет ссылку на ресурс </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr>Фреймы</tr><tr><td bgcolor="#eaeaea" valign="top"><frame></td><td bgcolor="#eaeaea" valign="top">Определяет подокно (фрейм)</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">F</td></tr><tr><td bgcolor="#eaeaea" valign="top"><frameset></td><td bgcolor="#eaeaea" valign="top">Определяет набор фреймов </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">F</td></tr><tr><td bgcolor="#eaeaea" valign="top"><noframes></td><td bgcolor="#eaeaea" valign="top">Определяет раздел noframe </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><iframe></td><td bgcolor="#eaeaea" valign="top">Определяет встроенное подокно (фрейм)</td><td bgcolor="#eaeaea" valign="top">6.0</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr>Ввод</tr><tr><td bgcolor="#eaeaea" valign="top"><form></td><td bgcolor="#eaeaea" valign="top">Определяет форму </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><input></td><td bgcolor="#eaeaea" valign="top">Определяет поле ввода </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><textarea></td><td bgcolor="#eaeaea" valign="top">Определяет текстовую область </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><button></td><td bgcolor="#eaeaea" valign="top">Определяет кнопку </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><select></td><td bgcolor="#eaeaea" valign="top">Определяет список с возможностью выбора </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><optgroup></td><td bgcolor="#eaeaea" valign="top">Определяет группу вариантов </td><td bgcolor="#eaeaea" valign="top">6.0</td><td bgcolor="#eaeaea" valign="top">6.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><option></td><td bgcolor="#eaeaea" valign="top">Определяет элемент в поле списка</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><label></td><td bgcolor="#eaeaea" valign="top">Определяет метку для элемента управления формы </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><fieldset></td><td bgcolor="#eaeaea" valign="top">Определяет набор полей </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><legend></td><td bgcolor="#eaeaea" valign="top">Определяет заголовок набора полей</td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><isindex></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет поле ввода из одной строки</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr>Списки</tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">Определяет неупорядоченный список</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">Определяет упорядоченный список </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><li></td><td bgcolor="#eaeaea" valign="top">Определяет элемент списка </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dir></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет список каталогов </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dl></td><td bgcolor="#eaeaea" valign="top">Задает список определений </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dt></td><td bgcolor="#eaeaea" valign="top">Задает термин определения </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dd></td><td bgcolor="#eaeaea" valign="top">Задает описание определения </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><menu></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет список меню</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr>Изображения</tr><tr><td bgcolor="#eaeaea" valign="top"><img></td><td bgcolor="#eaeaea" valign="top">Определяет изображение </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><map></td><td bgcolor="#eaeaea" valign="top">Определяет карту ссылок </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><area></td><td bgcolor="#eaeaea" valign="top">Определяет область внутри карты ссылок </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr>Таблицы</tr><tr><td bgcolor="#eaeaea" valign="top"><table></td><td bgcolor="#eaeaea" valign="top">Определяет таблицу </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><caption></td><td bgcolor="#eaeaea" valign="top">Определяет заглавие таблицы </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><th></td><td bgcolor="#eaeaea" valign="top">Определяет заголовок таблицы</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tr></td><td bgcolor="#eaeaea" valign="top">Определяет строку таблицы </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><td></td><td bgcolor="#eaeaea" valign="top">Определяет ячейку таблицы </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><thead></td><td bgcolor="#eaeaea" valign="top">Определяет верхний заголовок таблицы </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tbody></td><td bgcolor="#eaeaea" valign="top">Определяет тело таблицы </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tfoot></td><td bgcolor="#eaeaea" valign="top">Определяет нижний заголовок таблицы </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><col></td><td bgcolor="#eaeaea" valign="top">Определяет атрибуты для столбцов таблицы </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><colgroup></td><td bgcolor="#eaeaea" valign="top">Определяет группы столбцов таблицы </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr>Стили</tr><tr><td bgcolor="#eaeaea" valign="top"><style></td><td bgcolor="#eaeaea" valign="top">Задает определение стиля </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><div></td><td bgcolor="#eaeaea" valign="top">Определяет раздел документа</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><span></td><td bgcolor="#eaeaea" valign="top">Определяет раздел документа </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr>Мета-информация</tr><tr><td bgcolor="#eaeaea" valign="top"><head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/></td><td bgcolor="#eaeaea" valign="top">Задает информацию о документе </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><title></td><td bgcolor="#eaeaea" valign="top">Определяет заглавие документа </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><meta></td><td bgcolor="#eaeaea" valign="top">Определяет мета-информацию </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><base></td><td bgcolor="#eaeaea" valign="top">Определяет базовый URL для всех ссылок на странице </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><basefont></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет базовый шрифт</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr>Программирование</tr><tr><td bgcolor="#eaeaea" valign="top"><script></td><td bgcolor="#eaeaea" valign="top">Определяет сценарий </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><noscript></td><td bgcolor="#eaeaea" valign="top">Определяет раздел noscript </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><applet></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет апплет</td><td bgcolor="#eaeaea" valign="top">2.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><object></td><td bgcolor="#eaeaea" valign="top">Определяет встроенный объект </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><param></td><td bgcolor="#eaeaea" valign="top">Определяет параметр для объекта</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr></table><br><br> <h1>Сообщения о состоянии HTTP</h1> Когда браузер запрашивает обслуживание на Web-сервере, могут возникать ошибки.<br>Ниже представлен список сообщений о состоянии HTTP, которые могут возвращаться сервером:<br><table border=1>1xx: Информационные<tr>Сообщение:Описание:</tr><tr><td bgcolor="#eaeaea" valign="top">100 Continue</td><td bgcolor="#eaeaea" valign="top">Продолжить. Только часть запроса была получена сервером, но пока он не был отвергнут, клиент должен продолжать запрос.</td></tr><tr><td bgcolor="#eaeaea" valign="top">101 Switching Protocols</td><td bgcolor="#eaeaea" valign="top">Переключение протоколов. Сервер переключает протокол.</td></tr></table><table border=1>2xx: Успешное выполнение<tr>Сообщение:Описание:</tr><tr><td bgcolor="#eaeaea" valign="top">200 OK</td><td bgcolor="#eaeaea" valign="top">Запрос был успешно выполнен.</td></tr><tr><td bgcolor="#eaeaea" valign="top">201 Created</td><td bgcolor="#eaeaea" valign="top">Создан. Запрос завершен, и создан новый ресурс.</td></tr><tr><td bgcolor="#eaeaea" valign="top">202 Accepted</td><td bgcolor="#eaeaea" valign="top">Принято. Запрос принят для обработки, но обработка еще не завершена.</td></tr><tr><td bgcolor="#eaeaea" valign="top">203</td><td bgcolor="#eaeaea" valign="top">Недостоверная информация.</td></tr><tr><td bgcolor="#eaeaea" valign="top">204</td><td bgcolor="#eaeaea" valign="top">Нет содержимого</td></tr><tr><td bgcolor="#eaeaea" valign="top">205</td><td bgcolor="#eaeaea" valign="top">Сбросить содержимое.</td></tr><tr><td bgcolor="#eaeaea" valign="top">206</td><td bgcolor="#eaeaea" valign="top">Частичное содержимое.</td></tr></table><table border=1>3xx: Перенаправление<tr>Сообщение:Описание:</tr><tr><td bgcolor="#eaeaea" valign="top">300 Multiple Choices</td><td bgcolor="#eaeaea" valign="top">Множественный выбор. Список ссылок. Пользователь может выбрать ссылку и перейти в это место. Допустимо максимум пять адресов. </td></tr><tr><td bgcolor="#eaeaea" valign="top">301 Moved Permanently</td><td bgcolor="#eaeaea" valign="top">Перемещена постоянно. Запрошенная страница перемещена в новый url</td></tr><tr><td bgcolor="#eaeaea" valign="top">302 Found</td><td bgcolor="#eaeaea" valign="top">Найдена. Запрошенная страница временно перемещена в новый url</td></tr><tr><td bgcolor="#eaeaea" valign="top">303 See Other</td><td bgcolor="#eaeaea" valign="top">Смотри другой. Запрошенную страницу можно найти в другом url</td></tr><tr><td bgcolor="#eaeaea" valign="top">304 Not Modified</td><td bgcolor="#eaeaea" valign="top">Не модифицирован.</td></tr><tr><td bgcolor="#eaeaea" valign="top">305 Use Proxy</td><td bgcolor="#eaeaea" valign="top">Используйте прокси-сервер.</td></tr><tr><td bgcolor="#eaeaea" valign="top">306 Unused</td><td bgcolor="#eaeaea" valign="top">Не используется. Этот код использовался в предыдущей версии. Он больше не используется, но код зарезервирован. </td></tr><tr><td bgcolor="#eaeaea" valign="top">307 Temporary Redirect</td><td bgcolor="#eaeaea" valign="top">Временно перемещена. Запрошенная страница временно перемещена в новый url</td></tr></table><table border=1>4xx: Ошибки клиента<tr>Сообщение:Описание:</tr><tr><td bgcolor="#eaeaea" valign="top">400 Bad Request</td><td bgcolor="#eaeaea" valign="top">Испорченный запрос. Сервер не понял запрос.</td></tr><tr><td bgcolor="#eaeaea" valign="top">401 Unauthorized</td><td bgcolor="#eaeaea" valign="top">Неавторизовано. Запрошенная страница требует имя пользователя и пароль.</td></tr><tr><td bgcolor="#eaeaea" valign="top">402 Payment Required</td><td bgcolor="#eaeaea" valign="top">Требуется платеж. Этот код зарезервирован для будущего использования.</td></tr><tr><td bgcolor="#eaeaea" valign="top">403 Forbidden</td><td bgcolor="#eaeaea" valign="top">Запрещено. Доступ к запрошенной странице запрещен.</td></tr><tr><td bgcolor="#eaeaea" valign="top">404 Not Found</td><td bgcolor="#eaeaea" valign="top">Не найдено. Сервер не может найти запрошенную страницу.</td></tr><tr><td bgcolor="#eaeaea" valign="top">405 Method Not Allowed</td><td bgcolor="#eaeaea" valign="top">Метод не разрешен. Метод, указанный в запросе, не разрешен.</td></tr><tr><td bgcolor="#eaeaea" valign="top">406 Not Acceptable</td><td bgcolor="#eaeaea" valign="top">Не приемлем. Сервер может сгенерировать только такой ответ, который клиент не может принять.</td></tr><tr><td bgcolor="#eaeaea" valign="top">407 Proxy Authentication Required</td><td bgcolor="#eaeaea" valign="top">Требуется аутентификация на прокси-сервере. Необходимо аутентифицироваться на прокси-сервере, прежде чем этот запрос можно будет обслужить.</td></tr><tr><td bgcolor="#eaeaea" valign="top">408 Request Timeout</td><td bgcolor="#eaeaea" valign="top">Истекло время ожидания запроса. Запрос потребовал больше времени, чем сервер был готов ждать.</td></tr><tr><td bgcolor="#eaeaea" valign="top">409 Conflict</td><td bgcolor="#eaeaea" valign="top">Конфликт. Запрос невозможно завершить в связи с конфликтом.</td></tr><tr><td bgcolor="#eaeaea" valign="top">410 Gone</td><td bgcolor="#eaeaea" valign="top">Удален. Запрошенная страница больше недоступна.</td></tr><tr><td bgcolor="#eaeaea" valign="top">411 Length Required</td><td bgcolor="#eaeaea" valign="top">Требуется длина. Значение "Content-Length" не определено. Сервер без него не примет запрос.</td></tr><tr><td bgcolor="#eaeaea" valign="top">412 Precondition Failed</td><td bgcolor="#eaeaea" valign="top">Предусловие неверно. Предусловие, заданное в запросе, оказалось ложным при проверке сервером.</td></tr><tr><td bgcolor="#eaeaea" valign="top">413 Request Entity Too Large</td><td bgcolor="#eaeaea" valign="top">Объект запроса слишком большой. Сервер не пример запрос, потому что объект запроса слишком большой.</td></tr><tr><td bgcolor="#eaeaea" valign="top">414 Request-url Too Long</td><td bgcolor="#eaeaea" valign="top">url запроса слишком длинный. Сервер не примет запрос, потому что url слишком длинный. Происходит при преобразовании запроса "post" в запрос "get" с длинной информацией запроса. </td></tr><tr><td bgcolor="#eaeaea" valign="top">415 Unsupported Media Type</td><td bgcolor="#eaeaea" valign="top">Неподдерживаемый тип среды передачи. Сервер не примет запрос, так как тип среды передачи не поддерживается.</td></tr><tr><td bgcolor="#eaeaea" valign="top">416</td><td bgcolor="#eaeaea" valign="top">--</td></tr><tr><td bgcolor="#eaeaea" valign="top">417 Expectation Failed</td><td bgcolor="#eaeaea" valign="top">Ожидания не оправдались.</td></tr></table><table border=1>5xx: Ошибки сервера<tr>Сообщение:Описание:</tr><tr><td bgcolor="#eaeaea" valign="top">500 Internal Server Error</td><td bgcolor="#eaeaea" valign="top">Внутренняя ошибка сервера. Запрос не был завершен. Сервер столкнулся с непредвиденным условием.</td></tr><tr><td bgcolor="#eaeaea" valign="top">501 Not Implemented</td><td bgcolor="#eaeaea" valign="top">Не реализовано. Запрос не был завершен. Сервер не поддерживает запрошенные функции.</td></tr><tr><td bgcolor="#eaeaea" valign="top">502 Bad Gateway</td><td bgcolor="#eaeaea" valign="top">Ошибка шлюза. Запрос не был завершен. Сервер получил недопустимый ответ от другого сервера.</td></tr><tr><td bgcolor="#eaeaea" valign="top">503 Service Unavailable</td><td bgcolor="#eaeaea" valign="top">Служба недоступна. Запрос не был завершен. Сервер временно перегружен или отключен.</td></tr><tr><td bgcolor="#eaeaea" valign="top">504 Gateway Timeout</td><td bgcolor="#eaeaea" valign="top">Истекло время ожидания от шлюза.</td></tr><tr><td bgcolor="#eaeaea" valign="top">505 HTTP Version Not Supported</td><td bgcolor="#eaeaea" valign="top">Сервер не поддерживает данную версию "протокола http"</td></tr></table><br><br> <h1>Справочник по 7-битным кодам ASCII в HTML</h1> HTML и XHTML используют стандартный 7-битный код ASCII при передаче данных через Web.<br>7-битный код ASCII представляет 128 различных значений символов (0-127).<br>7-битные печатные символы ASCII<br><table border=1><tr>Результат Описание Номер объекта </tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">пробел </td><td bgcolor="#eaeaea" valign="top"> </td></tr><tr><td bgcolor="#eaeaea" valign="top">!</td><td bgcolor="#eaeaea" valign="top">восклицательный знак</td><td bgcolor="#eaeaea" valign="top">!</td></tr><tr><td bgcolor="#eaeaea" valign="top">"</td><td bgcolor="#eaeaea" valign="top">знак двойной кавычки</td><td bgcolor="#eaeaea" valign="top">"</td></tr><tr><td bgcolor="#eaeaea" valign="top">#</td><td bgcolor="#eaeaea" valign="top">знак номера </td><td bgcolor="#eaeaea" valign="top">#</td></tr><tr><td bgcolor="#eaeaea" valign="top">$</td><td bgcolor="#eaeaea" valign="top">знак доллара</td><td bgcolor="#eaeaea" valign="top">$</td></tr><tr><td bgcolor="#eaeaea" valign="top">%</td><td bgcolor="#eaeaea" valign="top">знак процента</td><td bgcolor="#eaeaea" valign="top">%</td></tr><tr><td bgcolor="#eaeaea" valign="top">&</td><td bgcolor="#eaeaea" valign="top">амперсанд</td><td bgcolor="#eaeaea" valign="top">&</td></tr><tr><td bgcolor="#eaeaea" valign="top">'</td><td bgcolor="#eaeaea" valign="top">апостроф </td><td bgcolor="#eaeaea" valign="top">'</td></tr><tr><td bgcolor="#eaeaea" valign="top">(</td><td bgcolor="#eaeaea" valign="top">левая скобка </td><td bgcolor="#eaeaea" valign="top">(</td></tr><tr><td bgcolor="#eaeaea" valign="top">)</td><td bgcolor="#eaeaea" valign="top">правая скобка </td><td bgcolor="#eaeaea" valign="top">)</td></tr><tr><td bgcolor="#eaeaea" valign="top">*</td><td bgcolor="#eaeaea" valign="top">звездочка </td><td bgcolor="#eaeaea" valign="top">*</td></tr><tr><td bgcolor="#eaeaea" valign="top">+</td><td bgcolor="#eaeaea" valign="top">знак плюс </td><td bgcolor="#eaeaea" valign="top">+</td></tr><tr><td bgcolor="#eaeaea" valign="top">,</td><td bgcolor="#eaeaea" valign="top">запятая </td><td bgcolor="#eaeaea" valign="top">,</td></tr><tr><td bgcolor="#eaeaea" valign="top">-</td><td bgcolor="#eaeaea" valign="top">дефис </td><td bgcolor="#eaeaea" valign="top">-</td></tr><tr><td bgcolor="#eaeaea" valign="top">.</td><td bgcolor="#eaeaea" valign="top">точка </td><td bgcolor="#eaeaea" valign="top">.</td></tr><tr><td bgcolor="#eaeaea" valign="top">/</td><td bgcolor="#eaeaea" valign="top">наклонная черта </td><td bgcolor="#eaeaea" valign="top">/</td></tr><tr><td bgcolor="#eaeaea" valign="top">0</td><td bgcolor="#eaeaea" valign="top">цифра 0</td><td bgcolor="#eaeaea" valign="top">0</td></tr><tr><td bgcolor="#eaeaea" valign="top">1</td><td bgcolor="#eaeaea" valign="top">цифра 1</td><td bgcolor="#eaeaea" valign="top">1</td></tr><tr><td bgcolor="#eaeaea" valign="top">2</td><td bgcolor="#eaeaea" valign="top">цифра 2</td><td bgcolor="#eaeaea" valign="top">2</td></tr><tr><td bgcolor="#eaeaea" valign="top">3</td><td bgcolor="#eaeaea" valign="top">цифра 3</td><td bgcolor="#eaeaea" valign="top">3</td></tr><tr><td bgcolor="#eaeaea" valign="top">4</td><td bgcolor="#eaeaea" valign="top">цифра 4</td><td bgcolor="#eaeaea" valign="top">4</td></tr><tr><td bgcolor="#eaeaea" valign="top">5</td><td bgcolor="#eaeaea" valign="top">цифра 5</td><td bgcolor="#eaeaea" valign="top">5</td></tr><tr><td bgcolor="#eaeaea" valign="top">6</td><td bgcolor="#eaeaea" valign="top">цифра 6</td><td bgcolor="#eaeaea" valign="top">6</td></tr><tr><td bgcolor="#eaeaea" valign="top">7</td><td bgcolor="#eaeaea" valign="top">цифра 7</td><td bgcolor="#eaeaea" valign="top">7</td></tr><tr><td bgcolor="#eaeaea" valign="top">8</td><td bgcolor="#eaeaea" valign="top">цифра 8</td><td bgcolor="#eaeaea" valign="top">8</td></tr><tr><td bgcolor="#eaeaea" valign="top">9</td><td bgcolor="#eaeaea" valign="top">цифра 9</td><td bgcolor="#eaeaea" valign="top">9</td></tr><tr><td bgcolor="#eaeaea" valign="top">:</td><td bgcolor="#eaeaea" valign="top">двоеточие </td><td bgcolor="#eaeaea" valign="top">:</td></tr><tr><td bgcolor="#eaeaea" valign="top">;</td><td bgcolor="#eaeaea" valign="top">точка с запятой </td><td bgcolor="#eaeaea" valign="top">;</td></tr><tr><td bgcolor="#eaeaea" valign="top"><</td><td bgcolor="#eaeaea" valign="top">меньше </td><td bgcolor="#eaeaea" valign="top"><</td></tr><tr><td bgcolor="#eaeaea" valign="top">=</td><td bgcolor="#eaeaea" valign="top">равно </td><td bgcolor="#eaeaea" valign="top">=</td></tr><tr><td bgcolor="#eaeaea" valign="top">>></td><td bgcolor="#eaeaea" valign="top">больше </td><td bgcolor="#eaeaea" valign="top">></td></tr><tr><td bgcolor="#eaeaea" valign="top">?</td><td bgcolor="#eaeaea" valign="top">знак вопроса </td><td bgcolor="#eaeaea" valign="top">?</td></tr><tr><td bgcolor="#eaeaea" valign="top">@</td><td bgcolor="#eaeaea" valign="top">знак at </td><td bgcolor="#eaeaea" valign="top">@</td></tr><tr><td bgcolor="#eaeaea" valign="top">A</td><td bgcolor="#eaeaea" valign="top">A </td><td bgcolor="#eaeaea" valign="top">A</td></tr><tr><td bgcolor="#eaeaea" valign="top">B</td><td bgcolor="#eaeaea" valign="top">B </td><td bgcolor="#eaeaea" valign="top">B</td></tr><tr><td bgcolor="#eaeaea" valign="top">C</td><td bgcolor="#eaeaea" valign="top">C </td><td bgcolor="#eaeaea" valign="top">C</td></tr><tr><td bgcolor="#eaeaea" valign="top">D</td><td bgcolor="#eaeaea" valign="top">D </td><td bgcolor="#eaeaea" valign="top">D</td></tr><tr><td bgcolor="#eaeaea" valign="top">E</td><td bgcolor="#eaeaea" valign="top">E </td><td bgcolor="#eaeaea" valign="top">E</td></tr><tr><td bgcolor="#eaeaea" valign="top">F</td><td bgcolor="#eaeaea" valign="top">F </td><td bgcolor="#eaeaea" valign="top">F</td></tr><tr><td bgcolor="#eaeaea" valign="top">G</td><td bgcolor="#eaeaea" valign="top">G </td><td bgcolor="#eaeaea" valign="top">G</td></tr><tr><td bgcolor="#eaeaea" valign="top">H</td><td bgcolor="#eaeaea" valign="top">H </td><td bgcolor="#eaeaea" valign="top">H</td></tr><tr><td bgcolor="#eaeaea" valign="top">I</td><td bgcolor="#eaeaea" valign="top">I </td><td bgcolor="#eaeaea" valign="top">I</td></tr><tr><td bgcolor="#eaeaea" valign="top">J</td><td bgcolor="#eaeaea" valign="top">J </td><td bgcolor="#eaeaea" valign="top">J</td></tr><tr><td bgcolor="#eaeaea" valign="top">K</td><td bgcolor="#eaeaea" valign="top">K </td><td bgcolor="#eaeaea" valign="top">K</td></tr><tr><td bgcolor="#eaeaea" valign="top">L</td><td bgcolor="#eaeaea" valign="top">L </td><td bgcolor="#eaeaea" valign="top">L</td></tr><tr><td bgcolor="#eaeaea" valign="top">M</td><td bgcolor="#eaeaea" valign="top">M </td><td bgcolor="#eaeaea" valign="top">M</td></tr><tr><td bgcolor="#eaeaea" valign="top">N</td><td bgcolor="#eaeaea" valign="top">N </td><td bgcolor="#eaeaea" valign="top">N</td></tr><tr><td bgcolor="#eaeaea" valign="top">O</td><td bgcolor="#eaeaea" valign="top">O </td><td bgcolor="#eaeaea" valign="top">O</td></tr><tr><td bgcolor="#eaeaea" valign="top">P</td><td bgcolor="#eaeaea" valign="top">P </td><td bgcolor="#eaeaea" valign="top">P</td></tr><tr><td bgcolor="#eaeaea" valign="top">Q</td><td bgcolor="#eaeaea" valign="top">Q </td><td bgcolor="#eaeaea" valign="top">Q</td></tr><tr><td bgcolor="#eaeaea" valign="top">R</td><td bgcolor="#eaeaea" valign="top">R </td><td bgcolor="#eaeaea" valign="top">R</td></tr><tr><td bgcolor="#eaeaea" valign="top">S</td><td bgcolor="#eaeaea" valign="top">S </td><td bgcolor="#eaeaea" valign="top">S</td></tr><tr><td bgcolor="#eaeaea" valign="top">T</td><td bgcolor="#eaeaea" valign="top">T </td><td bgcolor="#eaeaea" valign="top">T</td></tr><tr><td bgcolor="#eaeaea" valign="top">U</td><td bgcolor="#eaeaea" valign="top">U </td><td bgcolor="#eaeaea" valign="top">U</td></tr><tr><td bgcolor="#eaeaea" valign="top">V</td><td bgcolor="#eaeaea" valign="top">V </td><td bgcolor="#eaeaea" valign="top">V</td></tr><tr><td bgcolor="#eaeaea" valign="top">W</td><td bgcolor="#eaeaea" valign="top">W </td><td bgcolor="#eaeaea" valign="top">W</td></tr><tr><td bgcolor="#eaeaea" valign="top">X</td><td bgcolor="#eaeaea" valign="top">X </td><td bgcolor="#eaeaea" valign="top">X</td></tr><tr><td bgcolor="#eaeaea" valign="top">Y</td><td bgcolor="#eaeaea" valign="top">Y </td><td bgcolor="#eaeaea" valign="top">Y</td></tr><tr><td bgcolor="#eaeaea" valign="top">Z</td><td bgcolor="#eaeaea" valign="top">Z </td><td bgcolor="#eaeaea" valign="top">Z</td></tr><tr><td bgcolor="#eaeaea" valign="top">[</td><td bgcolor="#eaeaea" valign="top">левая квадратная скобка</td><td bgcolor="#eaeaea" valign="top">[</td></tr><tr><td bgcolor="#eaeaea" valign="top">\</td><td bgcolor="#eaeaea" valign="top">обратная косая черта </td><td bgcolor="#eaeaea" valign="top">\</td></tr><tr><td bgcolor="#eaeaea" valign="top">]</td><td bgcolor="#eaeaea" valign="top">правая квадратная скобка </td><td bgcolor="#eaeaea" valign="top">]</td></tr><tr><td bgcolor="#eaeaea" valign="top">^</td><td bgcolor="#eaeaea" valign="top">каре</td><td bgcolor="#eaeaea" valign="top">^</td></tr><tr><td bgcolor="#eaeaea" valign="top">_</td><td bgcolor="#eaeaea" valign="top">подчеркивание</td><td bgcolor="#eaeaea" valign="top">_</td></tr><tr><td bgcolor="#eaeaea" valign="top">`</td><td bgcolor="#eaeaea" valign="top">гравис</td><td bgcolor="#eaeaea" valign="top">`</td></tr><tr><td bgcolor="#eaeaea" valign="top">a</td><td bgcolor="#eaeaea" valign="top">a нижнего регистра </td><td bgcolor="#eaeaea" valign="top">a</td></tr><tr><td bgcolor="#eaeaea" valign="top">b</td><td bgcolor="#eaeaea" valign="top">b</td><td bgcolor="#eaeaea" valign="top">b</td></tr><tr><td bgcolor="#eaeaea" valign="top">c</td><td bgcolor="#eaeaea" valign="top"> c</td><td bgcolor="#eaeaea" valign="top">c</td></tr><tr><td bgcolor="#eaeaea" valign="top">d</td><td bgcolor="#eaeaea" valign="top"> d</td><td bgcolor="#eaeaea" valign="top">d</td></tr><tr><td bgcolor="#eaeaea" valign="top">e</td><td bgcolor="#eaeaea" valign="top"> e</td><td bgcolor="#eaeaea" valign="top">e</td></tr><tr><td bgcolor="#eaeaea" valign="top">f</td><td bgcolor="#eaeaea" valign="top"> f</td><td bgcolor="#eaeaea" valign="top">f</td></tr><tr><td bgcolor="#eaeaea" valign="top">g</td><td bgcolor="#eaeaea" valign="top"> g</td><td bgcolor="#eaeaea" valign="top">g</td></tr><tr><td bgcolor="#eaeaea" valign="top">h</td><td bgcolor="#eaeaea" valign="top"> h</td><td bgcolor="#eaeaea" valign="top">h</td></tr><tr><td bgcolor="#eaeaea" valign="top">i</td><td bgcolor="#eaeaea" valign="top"> i</td><td bgcolor="#eaeaea" valign="top">i</td></tr><tr><td bgcolor="#eaeaea" valign="top">j</td><td bgcolor="#eaeaea" valign="top"> j</td><td bgcolor="#eaeaea" valign="top">j</td></tr><tr><td bgcolor="#eaeaea" valign="top">k</td><td bgcolor="#eaeaea" valign="top"> k</td><td bgcolor="#eaeaea" valign="top">k</td></tr><tr><td bgcolor="#eaeaea" valign="top">l</td><td bgcolor="#eaeaea" valign="top"> l</td><td bgcolor="#eaeaea" valign="top">l</td></tr><tr><td bgcolor="#eaeaea" valign="top">m</td><td bgcolor="#eaeaea" valign="top"> m</td><td bgcolor="#eaeaea" valign="top">m</td></tr><tr><td bgcolor="#eaeaea" valign="top">n</td><td bgcolor="#eaeaea" valign="top"> n</td><td bgcolor="#eaeaea" valign="top">n</td></tr><tr><td bgcolor="#eaeaea" valign="top">o</td><td bgcolor="#eaeaea" valign="top"> o</td><td bgcolor="#eaeaea" valign="top">o</td></tr><tr><td bgcolor="#eaeaea" valign="top">p</td><td bgcolor="#eaeaea" valign="top"> p</td><td bgcolor="#eaeaea" valign="top">p</td></tr><tr><td bgcolor="#eaeaea" valign="top">q</td><td bgcolor="#eaeaea" valign="top"> q</td><td bgcolor="#eaeaea" valign="top">q</td></tr><tr><td bgcolor="#eaeaea" valign="top">r</td><td bgcolor="#eaeaea" valign="top"> r</td><td bgcolor="#eaeaea" valign="top">r</td></tr><tr><td bgcolor="#eaeaea" valign="top">s</td><td bgcolor="#eaeaea" valign="top"> s</td><td bgcolor="#eaeaea" valign="top">s</td></tr><tr><td bgcolor="#eaeaea" valign="top">t</td><td bgcolor="#eaeaea" valign="top"> t</td><td bgcolor="#eaeaea" valign="top">t</td></tr><tr><td bgcolor="#eaeaea" valign="top">u</td><td bgcolor="#eaeaea" valign="top"> u</td><td bgcolor="#eaeaea" valign="top">u</td></tr><tr><td bgcolor="#eaeaea" valign="top">v</td><td bgcolor="#eaeaea" valign="top"> v</td><td bgcolor="#eaeaea" valign="top">v</td></tr><tr><td bgcolor="#eaeaea" valign="top">w</td><td bgcolor="#eaeaea" valign="top"> w</td><td bgcolor="#eaeaea" valign="top">w</td></tr><tr><td bgcolor="#eaeaea" valign="top">x</td><td bgcolor="#eaeaea" valign="top"> x</td><td bgcolor="#eaeaea" valign="top">x</td></tr><tr><td bgcolor="#eaeaea" valign="top">y</td><td bgcolor="#eaeaea" valign="top"> y</td><td bgcolor="#eaeaea" valign="top">y</td></tr><tr><td bgcolor="#eaeaea" valign="top">z</td><td bgcolor="#eaeaea" valign="top"> z</td><td bgcolor="#eaeaea" valign="top">z</td></tr><tr><td bgcolor="#eaeaea" valign="top">{</td><td bgcolor="#eaeaea" valign="top">левая фигурная скобка</td><td bgcolor="#eaeaea" valign="top">{</td></tr><tr><td bgcolor="#eaeaea" valign="top">|</td><td bgcolor="#eaeaea" valign="top">вертикальная черта </td><td bgcolor="#eaeaea" valign="top">|</td></tr><tr><td bgcolor="#eaeaea" valign="top">}</td><td bgcolor="#eaeaea" valign="top">правая фигурная скобка </td><td bgcolor="#eaeaea" valign="top">}</td></tr><tr><td bgcolor="#eaeaea" valign="top">~</td><td bgcolor="#eaeaea" valign="top">тильда </td><td bgcolor="#eaeaea" valign="top">~</td></tr></table><table border=1>7-BIT ASCII Device Control Characters<tr>Результат Описание Номер объекта </tr><tr><td bgcolor="#eaeaea" valign="top">NUL</td><td bgcolor="#eaeaea" valign="top">пустой символ </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">SOH</td><td bgcolor="#eaeaea" valign="top">начало заголовка </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">STX</td><td bgcolor="#eaeaea" valign="top">начало текста </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">ETX</td><td bgcolor="#eaeaea" valign="top">конец текста </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">EOT</td><td bgcolor="#eaeaea" valign="top">конец передачи</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">ENQ</td><td bgcolor="#eaeaea" valign="top">запрос</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">ACK</td><td bgcolor="#eaeaea" valign="top">подтверждение </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">BEL</td><td bgcolor="#eaeaea" valign="top">звонок</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">BS</td><td bgcolor="#eaeaea" valign="top">возврат на одну позицию </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">HT</td><td bgcolor="#eaeaea" valign="top">горизонтальная табуляция</td><td bgcolor="#eaeaea" valign="top">	</td></tr><tr><td bgcolor="#eaeaea" valign="top">LF</td><td bgcolor="#eaeaea" valign="top">перевод строки </td><td bgcolor="#eaeaea" valign="top">
</td></tr><tr><td bgcolor="#eaeaea" valign="top">VT</td><td bgcolor="#eaeaea" valign="top">вертикальная табуляция </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">FF</td><td bgcolor="#eaeaea" valign="top">перевод страницы </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">CR</td><td bgcolor="#eaeaea" valign="top">возврат каретки </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">SO</td><td bgcolor="#eaeaea" valign="top">на верхний регистр</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">SI</td><td bgcolor="#eaeaea" valign="top">на нижний регистр </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">DLE</td><td bgcolor="#eaeaea" valign="top">смена канала данных </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">DC1</td><td bgcolor="#eaeaea" valign="top">управление устройством 1</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">DC2</td><td bgcolor="#eaeaea" valign="top">управление устройством 2</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">DC3</td><td bgcolor="#eaeaea" valign="top">управление устройством 3</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">DC4</td><td bgcolor="#eaeaea" valign="top">управление устройством 4</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">NAK</td><td bgcolor="#eaeaea" valign="top">отрицательное подтверждение</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">SYN</td><td bgcolor="#eaeaea" valign="top">синхронизация </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">ETB</td><td bgcolor="#eaeaea" valign="top">конец передачи блока </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">CAN</td><td bgcolor="#eaeaea" valign="top">отмена </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">EM</td><td bgcolor="#eaeaea" valign="top">конец носителя </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">SUB</td><td bgcolor="#eaeaea" valign="top">подстановка </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">ESC</td><td bgcolor="#eaeaea" valign="top">уход</td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">FS</td><td bgcolor="#eaeaea" valign="top">разделитель файлов </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">GS</td><td bgcolor="#eaeaea" valign="top">разделитель групп </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">RS</td><td bgcolor="#eaeaea" valign="top">разделитель записей </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">US</td><td bgcolor="#eaeaea" valign="top">разделитель элементов </td><td bgcolor="#eaeaea" valign="top"></td></tr><tr><td bgcolor="#eaeaea" valign="top">DEL</td><td bgcolor="#eaeaea" valign="top">удалить (стереть)</td><td bgcolor="#eaeaea" valign="top"></td></tr></table><br><br> <h1>поддерживает набор символов ISO </h1> HTML 4. 01 поддерживает набор символов ISO 8859-1 (Latin-1).<br><br>Нижняя часть ISO-8859-1 (коды 0-127) является исходным 7-битным стандартом ASCII. Большинство этих символов можно использовать без символьной ссылки.<br><br>Верхнюю часть ISO-8859-1 (коды 160-255) можно всю использовать с помощью имен символьных объектов.<br><br>Отметим, что имена объектов зависят от регистра символов.<br><br>Объекты ASCII с новыми именами объектов<br><br><table border=1><tr>Результат Описание Имя объекта Номер объекта </tr><tr><td>"</td><td>двойная кавычка </td><td>"</td><td>"</td></tr><tr><td>'</td><td>апостроф </td><td>' (не работает в IE)</td><td>'</td></tr><tr><td>&</td><td>амперсанд </td><td>&</td><td>&</td></tr><tr><td><</td><td>меньше </td><td><</td><td><</td></tr><tr><td>></td><td>больше </td><td>></td><td>></td></tr></table><table border=1>Символьные объекты ISO 8859-1<tr>Результат Описание Имя объекта Номер объекта </tr><tr><td> </td><td>Неразрывный пробел </td><td> </td><td> </td></tr><tr><td>Ў</td><td>перевернутый восклицательный знак</td><td>¡</td><td>¡</td></tr><tr><td>¤</td><td>валюта </td><td>¤</td><td>¤</td></tr><tr><td>ў</td><td>цент </td><td>¢</td><td>¢</td></tr><tr><td>Ј</td><td>фунт стерлингов</td><td>£</td><td>£</td></tr><tr><td>Ґ</td><td>йена </td><td>¥</td><td>¥</td></tr><tr><td>¦</td><td>разорванная вертикальная черта </td><td>¦</td><td>¦</td></tr><tr><td>§</td><td>параграф </td><td>§</td><td>§</td></tr><tr><td>Ё</td><td>умлаут </td><td>¨</td><td>¨</td></tr><tr><td>©</td><td>авторское право</td><td>©</td><td>©</td></tr><tr><td>Є</td><td>порядковый индикатор ж.р.</td><td>ª</td><td>ª</td></tr><tr><td>"</td><td>угловая кавычка (левая)</td><td>«</td><td>«</td></tr><tr><td>¬</td><td>отрицание </td><td>¬</td><td>¬</td></tr><tr><td> </td><td>мягкий дефис </td><td></td><td></td></tr><tr><td>®</td><td>зарегистрированная торговая марка</td><td>®</td><td>®</td></tr><tr><td>™</td><td>торговая марка </td><td>™</td><td>™</td></tr><tr><td>Ї</td><td>знак долготы </td><td>¯</td><td>¯</td></tr><tr><td>°</td><td>градус</td><td>°</td><td>°</td></tr><tr><td>±</td><td>плюс-минус</td><td>±</td><td>±</td></tr><tr><td>І</td><td>верхний индекс 2</td><td>²</td><td>²</td></tr><tr><td>і</td><td>верхний индекс 3</td><td>³</td><td>³</td></tr><tr><td>ґ</td><td>ударение </td><td>´</td><td>´</td></tr><tr><td>µ</td><td>микро</td><td>µ</td><td>µ</td></tr><tr><td>¶</td><td>параграф</td><td>¶</td><td>¶</td></tr><tr><td>•</td><td>средняя точка </td><td>·</td><td>·</td></tr><tr><td>ё</td><td>седиль </td><td>¸</td><td>¸</td></tr><tr><td>№</td><td>верхний индекс 1</td><td>¹</td><td>¹</td></tr><tr><td>є</td><td>порядковый индикатор м.р.</td><td>º</td><td>º</td></tr><tr><td>"</td><td>угловая кавычка (правая)</td><td>»</td><td>»</td></tr><tr><td>ј</td><td>дробь 1/4</td><td>¼</td><td>¼</td></tr><tr><td>Ѕ</td><td>дробь 1/2</td><td>½</td><td>½</td></tr><tr><td>ѕ</td><td>дробь 3/4</td><td>¾</td><td>¾</td></tr><tr><td>ї</td><td>перевернутый знак вопроса</td><td>¿</td><td>¿</td></tr><tr><td>Ч</td><td>умножение </td><td>×</td><td>×</td></tr><tr><td>ч</td><td>деление </td><td>÷</td><td>÷</td></tr></table><table border=1>Символьные объекты ISO 8859-1<tr>Результат Описание Имя объекта Номер объекта </tr><tr><td>А</td><td>a большая, гравис</td><td>À</td><td>À</td></tr><tr><td>Б</td><td>a большое, акут</td><td>Á</td><td>Á</td></tr><tr><td>В</td><td>a большое, циркумфлекс</td><td>Â</td><td>Â</td></tr><tr><td>Г</td><td>a большое, тильда</td><td>Ã</td><td>Ã</td></tr><tr><td>Д</td><td>a большое , умлаут</td><td>Ä</td><td>Ä</td></tr><tr><td>Е</td><td>a большое, кружок</td><td>Å</td><td>Å</td></tr><tr><td>Ж</td><td>ae большое</td><td>Æ</td><td>Æ</td></tr><tr><td>З</td><td>c большое, седиль </td><td>Ç</td><td>Ç</td></tr><tr><td>И</td><td>e большое, гравис</td><td>È</td><td>È</td></tr><tr><td>Й</td><td>e большое, акут</td><td>É</td><td>É</td></tr><tr><td>К</td><td>e большое, циркумфлекс </td><td>Ê</td><td>Ê</td></tr><tr><td>Л</td><td>e большое, умлаут</td><td>Ë</td><td>Ë</td></tr><tr><td>М</td><td>i большое, гравис</td><td>Ì</td><td>Ì</td></tr><tr><td>Н</td><td>i большое, акут</td><td>Í</td><td>Í</td></tr><tr><td>О</td><td>i большое, циркумфлекс</td><td>Î</td><td>Î</td></tr><tr><td>П</td><td>i большое, умлаут </td><td>Ï</td><td>Ï</td></tr><tr><td>Р</td><td>eth большое, исландское </td><td>Ð</td><td>Ð</td></tr><tr><td>С</td><td>n большое, тильда</td><td>Ñ</td><td>Ñ</td></tr><tr><td>Т</td><td>o большое, гравис</td><td>Ò</td><td>Ò</td></tr><tr><td>У</td><td>o большое, акут</td><td>Ó</td><td>Ó</td></tr><tr><td>Ф</td><td>o большое, циркумфлекс</td><td>Ô</td><td>Ô</td></tr><tr><td>Х</td><td>o большое, тильда </td><td>Õ</td><td>Õ</td></tr><tr><td>Ц</td><td>o большое, умлаут</td><td>Ö</td><td>Ö</td></tr><tr><td>Ш</td><td>o большое, перечеркнуто</td><td>Ø</td><td>Ø</td></tr><tr><td>Щ</td><td>u большое, гравис</td><td>Ù</td><td>Ù</td></tr><tr><td>Ъ</td><td>u большое, акут</td><td>Ú</td><td>Ú</td></tr><tr><td>Ы</td><td>u большое, циркумфлекс</td><td>Û</td><td>Û</td></tr><tr><td>Ь</td><td>u большое, умлаут</td><td>Ü</td><td>Ü</td></tr><tr><td>Э</td><td>y большое, акут</td><td>Ý</td><td>Ý</td></tr><tr><td>Ю</td><td>THORN большой, исладский</td><td>Þ</td><td>Þ</td></tr><tr><td>Я</td><td>s малое, немецкое</td><td>ß</td><td>ß</td></tr><tr><td>а</td><td>a малое, гравис</td><td>à</td><td>à</td></tr><tr><td>б</td><td>a малое, акут </td><td>á</td><td>á</td></tr><tr><td>в</td><td>a малое, циркумфлекс</td><td>â</td><td>â</td></tr><tr><td>г</td><td>a малое, тильда</td><td>ã</td><td>ã</td></tr><tr><td>д</td><td>a малое, умлаут</td><td>ä</td><td>ä</td></tr><tr><td>е</td><td>a малое, с кружком</td><td>å</td><td>å</td></tr><tr><td>ж</td><td>ae малое</td><td>æ</td><td>æ</td></tr><tr><td>з</td><td>c малое, седиль</td><td>ç</td><td>ç</td></tr><tr><td>и</td><td>e малое, гравис </td><td>è</td><td>è</td></tr><tr><td>й</td><td>e малое, акут</td><td>é</td><td>é</td></tr><tr><td>к</td><td>e малое, циркумфлекс</td><td>ê</td><td>ê</td></tr><tr><td>л</td><td>e малое, умлаут </td><td>ë</td><td>ë</td></tr><tr><td>м</td><td>i малое, гравис </td><td>ì</td><td>ì</td></tr><tr><td>н</td><td>i малое, акут </td><td>í</td><td>í</td></tr><tr><td>о</td><td>i малое, циркумфлекс </td><td>î</td><td>î</td></tr><tr><td>п</td><td>i малое, умлаут </td><td>ï</td><td>ï</td></tr><tr><td>р</td><td>eth малое, исландское</td><td>ð</td><td>ð</td></tr><tr><td>с</td><td>n малое, тильда </td><td>ñ</td><td>ñ</td></tr><tr><td>т</td><td>o малое, гравис </td><td>ò</td><td>ò</td></tr><tr><td>у</td><td>o малое, акут </td><td>ó</td><td>ó</td></tr><tr><td>ф</td><td>o малое, циркумфлекс</td><td>ô</td><td>ô</td></tr><tr><td>х</td><td>o малое, тильда </td><td>õ</td><td>õ</td></tr><tr><td>ц</td><td>o малое, умлаут </td><td>ö</td><td>ö</td></tr><tr><td>ш</td><td>o малое, перечеркнутое</td><td>ø</td><td>ø</td></tr><tr><td>щ</td><td>u малое, гравис </td><td>ù</td><td>ù</td></tr><tr><td>ъ</td><td>u малое, акут </td><td>ú</td><td>ú</td></tr><tr><td>ы</td><td>u малое, циркумфлекс </td><td>û</td><td>û</td></tr><tr><td>ь</td><td>u малое, умлаут </td><td>ü</td><td>ü</td></tr><tr><td>э</td><td>y малое, акут </td><td>ý</td><td>ý</td></tr><tr><td>ю</td><td>thorn малый, исландский</td><td>þ</td><td>þ</td></tr><tr><td>я</td><td>y малое, умлаут </td><td>ÿ</td><td>ÿ</td></tr></table><table border=1>Некоторые другие объекты, поддерживаемые в HTML<tr>Результат Описание Имя объекта Номер объекта </tr><tr><td>Њ</td><td>OE большое, связанное </td><td>&OElig;</td><td>Œ</td></tr><tr><td>њ</td><td>oe малое, связанное </td><td>&oelig;</td><td>œ</td></tr><tr><td>Љ</td><td>S большое с короной</td><td>&Scaron;</td><td>Š</td></tr><tr><td>љ</td><td>S малое с короной </td><td>&scaron;</td><td>š</td></tr><tr><td>џ</td><td>Y большое с тремой</td><td>&Yuml;</td><td>Ÿ</td></tr><tr><td>€</td><td>циркумфлекс </td><td>&circ;</td><td>ˆ</td></tr><tr><td>_</td><td>малая тильда </td><td>&tilde;</td><td>˜</td></tr><tr><td>?</td><td>пробел en </td><td>&ensp;</td><td> </td></tr><tr><td>?</td><td>пробел em </td><td>&emsp;</td><td> </td></tr><tr><td>?</td><td>тонкий пробел </td><td> </td><td> </td></tr><tr><td></td><td>non-joiner </td><td>&zwnj;</td><td>‌</td></tr><tr><td></td><td>joiner</td><td>&zwj;</td><td>‍</td></tr><tr><td></td><td>знак слева направо</td><td>&lrm;</td><td>‎</td></tr><tr><td></td><td>знак справа налево</td><td>&rlm;</td><td>‏</td></tr><tr><td>–</td><td>штрих en </td><td>–</td><td>–</td></tr><tr><td>—</td><td>штрих em </td><td>—</td><td>—</td></tr><tr><td>‘</td><td>левая одиночная кавычка </td><td>‘</td><td>‘</td></tr><tr><td>’</td><td>правая одиночная кавычка</td><td>’</td><td>’</td></tr><tr><td>‚</td><td>одиночная нижняя кавычка</td><td>&sbquo;</td><td>‚</td></tr><tr><td>"</td><td>левая двойная кавычка</td><td>“</td><td>“</td></tr><tr><td>"</td><td>правая двойная кавычка </td><td>”</td><td>”</td></tr><tr><td>„</td><td>двойная нижняя кавычка</td><td>&bdquo;</td><td>„</td></tr><tr><td>†</td><td>крестик</td><td>&dagger;</td><td>†</td></tr><tr><td>‡</td><td>двойной крестик </td><td>&Dagger;</td><td>‡</td></tr><tr><td>…</td><td>три точки </td><td>…</td><td>…</td></tr><tr><td>‰</td><td>промилле </td><td>&permil;</td><td>‰</td></tr><tr><td>‹</td><td>одиночная угловая левая кавычка</td><td>&lsaquo;</td><td>‹</td></tr><tr><td>›</td><td>одиночная угловая правая кавычка</td><td>&rsaquo;</td><td>›</td></tr><tr><td>€</td><td>евро </td><td>€</td><td>€</td></tr></table><br> <h1>В алфавитном порядке</h1> <li>NN: указывает самую раннюю версию Netscape, которая поддерживает этот тег</li><li>IE: указывает самую раннюю версию Internet Explorer, которая поддерживает этот тег</li><li>DTD: указывает в каком DTD XHTML 1.0 разрешен этот тег. S=Strict, T=Transitional и F=Frameset</li><table border=1><tr>ТегОписаниеNNIEDTD</tr><tr><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">Определяет комментарий </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><!DOCTYPE></td><td bgcolor="#eaeaea" valign="top">Определяет тип документа</td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><a></td><td bgcolor="#eaeaea" valign="top">Определяет анкер </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><abbr></td><td bgcolor="#eaeaea" valign="top">Определяет сокращение </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><acronym></td><td bgcolor="#eaeaea" valign="top">Определяет акроним </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><address></td><td bgcolor="#eaeaea" valign="top">Определяет элемент адреса </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><applet></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет апплет</td><td bgcolor="#eaeaea" valign="top">2.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><area></td><td bgcolor="#eaeaea" valign="top">Определяет область внутри карты ссылок</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><b></td><td bgcolor="#eaeaea" valign="top">Определяет жирный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><base></td><td bgcolor="#eaeaea" valign="top">Определяет базовый URL для всех ссылок на странице </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><basefont></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет базовый шрифт</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><bdo></td><td bgcolor="#eaeaea" valign="top">Определяет направление вывода текста </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">5.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><big></td><td bgcolor="#eaeaea" valign="top">Определяет увеличенный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><blockquote></td><td bgcolor="#eaeaea" valign="top">Определяет длинную цитату </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><body></td><td bgcolor="#eaeaea" valign="top">Определяет элемент тела </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><br></td><td bgcolor="#eaeaea" valign="top">Определякет перенос одной строки</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><button></td><td bgcolor="#eaeaea" valign="top">Определяет кнопку</td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><caption></td><td bgcolor="#eaeaea" valign="top">Определяет заглавие таблицы</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><center></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет центрированный текст</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><cite></td><td bgcolor="#eaeaea" valign="top">Определяет цитату</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><code></td><td bgcolor="#eaeaea" valign="top">Определяет текст кода программы </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><col></td><td bgcolor="#eaeaea" valign="top">Определяет атрибуты для столбцов таблицы </td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><colgroup></td><td bgcolor="#eaeaea" valign="top">Определяет группы столбцов таблицы</td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dd></td><td bgcolor="#eaeaea" valign="top">Определяет описание определения</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><del></td><td bgcolor="#eaeaea" valign="top">Определяет удаленный текст </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dir></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет список каталогов </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><div></td><td bgcolor="#eaeaea" valign="top">Определяет раздел документа</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dfn></td><td bgcolor="#eaeaea" valign="top">Задает термин определения</td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dl></td><td bgcolor="#eaeaea" valign="top">Определяет список определений </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><dt></td><td bgcolor="#eaeaea" valign="top">Задает термин определения </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><em></td><td bgcolor="#eaeaea" valign="top">Определяет выделенный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><fieldset></td><td bgcolor="#eaeaea" valign="top">Определяет набор полей </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><font></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет шрифт, размер и цвет текста </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><form></td><td bgcolor="#eaeaea" valign="top">Определяет форму </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><frame></td><td bgcolor="#eaeaea" valign="top">Определяет подокно (фрейм)</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">F</td></tr><tr><td bgcolor="#eaeaea" valign="top"><frameset></td><td bgcolor="#eaeaea" valign="top">Определяет набор фреймов</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">F</td></tr><tr><td bgcolor="#eaeaea" valign="top"><h1> до <h6></td><td bgcolor="#eaeaea" valign="top">Определяют заголовки с 1 по 6 размер</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><head> <link rel="canonical" href="https://www.e-lave.ru//01.htm"/></td><td bgcolor="#eaeaea" valign="top">Определяет информацию о документе </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><hr></td><td bgcolor="#eaeaea" valign="top">Определяет горизонтальную линейку</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><html></td><td bgcolor="#eaeaea" valign="top">Определяет документ html</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><i></td><td bgcolor="#eaeaea" valign="top">Определяет наклонный текст (курсив)</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><iframe></td><td bgcolor="#eaeaea" valign="top">Определяет встроенное подокно (фрейм)</td><td bgcolor="#eaeaea" valign="top">6.0</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><img></td><td bgcolor="#eaeaea" valign="top">Определяет изображение</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><input></td><td bgcolor="#eaeaea" valign="top">Определяет поле ввода </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><ins></td><td bgcolor="#eaeaea" valign="top">Определяет вставленный текст </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><isindex></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет поле ввода из одной строки</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><kbd></td><td bgcolor="#eaeaea" valign="top">Определяет текст с клавиатуры </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><label></td><td bgcolor="#eaeaea" valign="top">Определяет метку для элемента управления формы </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><legend></td><td bgcolor="#eaeaea" valign="top">Определяет заголовок в наборе полей </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><li></td><td bgcolor="#eaeaea" valign="top">Определяет элемент списка</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><link></td><td bgcolor="#eaeaea" valign="top">Определяет ссылку на ресурс </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><map></td><td bgcolor="#eaeaea" valign="top">Определяет карту ссылок </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><menu></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет список меню</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><meta></td><td bgcolor="#eaeaea" valign="top">Определяет мета-информацию </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><noframes></td><td bgcolor="#eaeaea" valign="top">Определяет раздел noframe </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><noscript></td><td bgcolor="#eaeaea" valign="top">Определяет раздел noscript</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><object></td><td bgcolor="#eaeaea" valign="top">Определяет встроенный объект</td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">Определяет упорядоченный список </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><optgroup></td><td bgcolor="#eaeaea" valign="top">Определяет группу вариантов </td><td bgcolor="#eaeaea" valign="top">6.0</td><td bgcolor="#eaeaea" valign="top">6.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><option></td><td bgcolor="#eaeaea" valign="top">Определяет вариант в раскрывающемся списке </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">Определяет параграф </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><param></td><td bgcolor="#eaeaea" valign="top">Определяет параметр для объекта </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><pre></td><td bgcolor="#eaeaea" valign="top">Определяет заранее отформатированный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><q></td><td bgcolor="#eaeaea" valign="top">Определяет короткую цитату </td><td bgcolor="#eaeaea" valign="top">6.2</td><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><s></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет зачеркнутый текст</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><samp></td><td bgcolor="#eaeaea" valign="top">Определяет образец программного кода </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><script></td><td bgcolor="#eaeaea" valign="top">Определяет сценарий </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><select></td><td bgcolor="#eaeaea" valign="top">Определяет список с возможностью выбора</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><small></td><td bgcolor="#eaeaea" valign="top">Определяет уменьшенный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><span></td><td bgcolor="#eaeaea" valign="top">Определяет раздел документа</td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><strike></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет зачеркнутый текст</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><strong></td><td bgcolor="#eaeaea" valign="top">Определяет акцентированный текст </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><style></td><td bgcolor="#eaeaea" valign="top">Задает определение стиля </td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><sub></td><td bgcolor="#eaeaea" valign="top">Определяет текст как нижний индекс </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><sup></td><td bgcolor="#eaeaea" valign="top">Определяет текст как верхний индекс</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><table></td><td bgcolor="#eaeaea" valign="top">Определяет таблицу</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tbody></td><td bgcolor="#eaeaea" valign="top">Определяет тело таблицы </td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><td></td><td bgcolor="#eaeaea" valign="top">Определяет ячейку таблицы </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><textarea></td><td bgcolor="#eaeaea" valign="top">Определяет текстовую область </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tfoot></td><td bgcolor="#eaeaea" valign="top">Определяет нижний заголовок таблицы </td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><th></td><td bgcolor="#eaeaea" valign="top">Определяет заголовок таблицы</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><thead></td><td bgcolor="#eaeaea" valign="top">Определяет верхний заголовок таблицы</td><td bgcolor="#eaeaea" valign="top"></td><td bgcolor="#eaeaea" valign="top">4.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><title></td><td bgcolor="#eaeaea" valign="top">Определяет заглавие документа </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tr></td><td bgcolor="#eaeaea" valign="top">Определяет строку таблицы </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><tt></td><td bgcolor="#eaeaea" valign="top">Определяет текст телетайпа </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><u></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет подчеркнутый текст</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">TF</td></tr><tr><td bgcolor="#eaeaea" valign="top"> </td><td bgcolor="#eaeaea" valign="top">Определяет неупорядоченный список </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><var></td><td bgcolor="#eaeaea" valign="top">Определяет переменную </td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">STF</td></tr><tr><td bgcolor="#eaeaea" valign="top"><xmp></td><td bgcolor="#eaeaea" valign="top">Не рекомендуется. Определяет заранее отформатированный текст</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top">3.0</td><td bgcolor="#eaeaea" valign="top"></td></tr></table><br><br> <a name="34"><h1>  <img src="/8.gif">  Бизнес в интернете: Сайты - Софт - Языки - Дизайн</h1> <ul> <li><a href="/390-1/index.htm">Киберсантинг</a><br> <li><a href="/391-1/index.htm">Киберсантинг как бизнес</a><br> <li><a href="/392-1/index.htm">Виды Киберсантинга</a><br> <li><a href="/691-1/index.htm">Создание игр</a><br> <li><a href="/393-1/index.htm">Дизайн как бизнес</a><br> <br> <li><a href="/394-1/index.htm">Dreamweaver</a><br> <li><a href="/395-1/index.htm">PHP</a><br> <li><a href="/396-1/index.htm">Homesite</a><br> <li><a href="/397-1/index.htm">Frontpage</a><br> <li><a href="/398-1/index.htm">Studio MX</a><br> <br> <li><a href="/432-1/index.htm">Сайтостроительство</a><br> <li><a href="/433-1/index.htm">Citrix MetaFrame</a><br> <li><a href="/434-1/index.htm">Стили сайта</a><br> <li><a href="/435-1/index.htm">ActiveX на сайте</a><br> <li><a href="/436-1/index.htm">HTML как основа сайта</a><br> <br> <li><a href="/437-1/index.htm">Adobe GoLive</a><br> <li><a href="/438-1/index.htm">Что такое WEB</a><br> <li><a href="/439-1/index.htm">Мобильные WAP сайты</a><br> <li><a href="/440-1/index.htm">3D графика на сайтах</a><br> <li><a href="/442-1/index.htm">3DS MAX графические решения</a><br> <br> <li><a href="/443-1/index.htm">Графика в 3D Studio MAX и на сайте</a><br> </ul> <br> </div></div> </body></html> <br>}}

	Определяет документ HTML
	Определяет основную часть или тело документа
--	Определяет заголовки с 1 по 6
	Определяет параграф
	Вставляет единичный перенос строки
	Определяет горизонтальную линейку
	Определяет комментарий

	Задает жирный текст
	Относительное увеличение текста
	Выделяет текст (обычно курсив)
	Задает курсив
	Относительное уменьшение текста
	Акцентирует текст (обычно жирный)
	Определяет нижний индекс
	Определяет верхний индекс
	Вставленный текст
	Удаленный текст
	Не рекомендуется. Используйте вместо этого
	Не рекомендуется. Используйте вместо этого
	Не рекомендуется. Используйте вместо этого стили (style)