Рейтинг: 4.8/5.0 (1843 проголосовавших)Категория: Windows: HTML
В Windows: Microsoft Internet Explorer, Mozilla Firefox, Adobe Dreamweaver CS5, Adobe ColdFusion Builder 2, Microsoft Visual Web Developer, Microsoft Visual Studio 2010, Microsoft Notepad, Nvu, Adobe Contribute, Adobe Creative Suite, Adobe ExtendScript, Safari for Microsoft Windows, Opera, любой другой веб-браузер, любой другой текстовый редактор.
В Mac OS: Apple Safari, Mozilla Firefox, Adobe Creative Suite for Mac, Adobe GoLive, Adobe Dreamweaver CS5, Adobe ColdFusion Builder 2, любой другой веб-браузер, любой другой текстовый редактор.
В Linux: Firefox for Linux, Opera for Linux, Chromium for Linux, Konqueror, gedit, GNU Emacs, Google Chrome for Linux
Описание HTMПопулярность: 
Расширение файла HTM связано с языком гипертекстовой разметки. Язык HTML предоставляет средства для создания структурированных документов, обозначая структурные семантики текста, например, заголовки, абзацы, списки, ссылки, цитаты и другие предметы. Это основной язык для написания веб-страниц.
.HTM файлы, иногда используются на DOS-компьютерах, которые не понимают расширения с более чем 3 символа. Но файлы .HTM – это такие же файлы, как и файлы с расширением HTML .
Файлы .HTM веб-страниц закодированы на языке HTML. HTM веб-страницы могут отображаться в любом веб-браузере. HTM форматирует текст, таблицы, изображения и другое содержимое, которое будет отображаться на странице. Большинство страниц в статических веб-сайтах имеют расширение .HTML.
HTML-код разбирается веб-браузером и, как правило, не видны пользователю. Но пользователи обычно имеют возможность «просмотреть исходный файл» в своем веб-браузере. Поэтому HTM-файлы сохраняются в стандартном текстовом формате, их можно открыть и редактировать с помощью любого текстового редактора.
С 1996 года World Wide Web Consortium (W3C) поддерживала спецификацию HTML при участии коммерческих поставщиков программного обеспечения. Тем не менее, в 2000 году, HTML также стала международным стандартом (ISO\IEC 15445:2000). Последнюю спецификацию HTML опубликованную W3C – HTML 4.01 Рекомендация, был опубликована в конце 1999 года. Его проблемы и ошибки в последний раз были признаны исправлением, опубликованным в 2001 году.
Mime-тип: text/html.
Гиперссылка (hyperlink) - функциональный базовый элемент HTML-документа, представляющий собой реализацию динамической связи какого-либо объекта данной Web-страницы с контекстным содержимым другого документа.
Чтобы разъяснить этот термин, Приведем простой пример. Предположим, что созданный вами НТМL-документ включает текст, в котором встречается слово «гиперссылка», а подробное раскрытие этого термина приведено в другом документе, размещенном в Интернете независимо от первого. Преобразовав данное слово в гиперссылку и связав ее с указанным выше документом, вы организуете тем самым простейшую гиперсвязь: пользователю, желающему ознакомиться со значением термина «гиперссылкю>, достаточно щелкнуть мышью на этом слове, чтобы перейти к Web-странице с соответствуюшими пояснениями. Следует отметить, что в качестве гиперссылки может использоваться как элемент текста, так и графический объект, а саму гиперсвязь можно устанавливать как между несколькими документами, расположенными на OДHO
I физическом сервере, так и с объектами, размещенными на различных узлах Интернета.
В отличие от других языков, HTML — язык не транслируемый, но интерпретируемый. Это означает, что для исполнения готового кода его не нужно компилировать, встроенный в специальное программное обеспечение, предназначенное для просмотра Web-страниц, интерпретатор «компилирует» код непосредственно в процессе открытия документа. При этом, обнаружив в тексте ошибку, такая программа не выдает соответствующего предупреждения (если страница не содержит встроенных скриптов Java), а попросту игнорирует весь «ошибочный» тег (о тегах HTML будет сказано позже). Это следует иметь в виду, составляя НТМL-программу, поскольку можно ненароком пропустить «незаметную» ошибку и выявить ее наличие уже тогда, когда страница будет опубликована в Web.
Редакторы HTMLСуществует два типа редакторов. Первый тип, это "визуальные" редакторы, или редакторы WYSIWYG. Они подходят тем, кто не хочет вникать в HTML и кто не собирается в будущем писать на HTML. Вот несколько таких редакторов:
Второй тип, это редакторы, работающие напрямую с кодом HTML. Замечу, что Macromedia DreamWeaver и последние версии MS FrontPage совмещают в себе оба типа. Вот примеры таких редакторов:
Очень часто спрашивают: "Какой редактор выбрать?" ответа на этот вопрос не существует так как это дело вкуса. Но хочу вас предупредить, что сначала я буду просто показывать приёмы HTML, а только потом расскажу как лучше работать в двух наипопулярнейших редакторах (Macromedia DreamWeaver и MS FrontPage). Поэтому советую начать с блокнота.
Для просмотра НТМL-документов необходимо специальное программное обеспечение, предназначенное для динамической обработки кода HTML и отображения Web-страниц. Такие программы называются браузерами.
Существует несколько классов браузеров, различающихся в основном спектром реализуемых ими возможностей. Два основных класса - это браузеры, поддерживающие и не поддерживающие отображение графических элементов Web-страниц. Большинство современных браузеров относятся к первому классу. Наиболее распространены среди пользователей Интернета браузеры MS Internet Explorer и Netscape Navigator предназначенные для работы в среде MS Windows. Менее распространены Opera, Arachne (работает под управлением DOS) и текстовый браузер для UNIХ-совместимых платформ под названием Lynx.
Следует заметить, что разные браузеры отображают один и тот же документ по-розному, но эти различия не очень существенны. Более острым стоит вопрос о том, что разные браузеры не поддерживают разные особенности HTML.
Коды языка HTML, с помощью которых выполняется разметка текста, называются тегами. Тег — это набор символов. Теги начинаются с символа "меньше" (<) и заканчиваются символом "больше" (>). Эта пара символов ещё называется "угловыми скобками". После символа "<" идёт ключевое слово, зачастую сокращение от английского слова. Когда ставится символ открывающей угловой скобки (<), говорят: "тег открывается". После кючевого слова идут атрибуты тега с их значениями, а потом ставится символ закрывающей угловой скобки ">" (говорят: "тег закрывается"). Теги бывают парными и не парными. Парные теги обычно указывают на форматирование какого-то текста. Парные теги делятся на открывающие и закрывающие. Открывающий тег задаёт браузеру команду для начала применения эффекта, закрывающий тег даёт команду браузеру о прекращении эффекта. Закрывающий тег отличается от открывающего следующими чертами:
Непарные теги обычно вставляют в страницу какой-то отдельный объект HTML (например: картинка, линия) или дают эффект деления абзаца (перенос на новую строку без окончания абзаца).
Так же замечу, что при написании тегов не важен регистр букв, а если тег не известен браузеру, то он им игнорируется.
Теги HTML:
<BoDy>, <HTML>, <p>
Парные теги:
<b></b>, <h1></h1>, <table></table>
Тег с атрибутами:
<BODY bgcolor="red" text="blue">
И самое главное о тегах: при отображении страницы в браузере они не отображаются, но, как было сказано выше, задают эффекты отображению документа.
Атрибуты тегов и их значенияАтрибут тега — дополнительное ключевое слово. От основного ключевого слова оно отделяется пробелом, а от значения — знаком "равно" (=). В отличие от тегов и атрибутов, значение может представятся как угодно (даже не одним словом, а несколькими). Значение атрибута берётся в кавычки, но их можно опустить если значение
КомментарииКак и в языках программирования, в HTML есть комментарии. Они обрабатываются браузерами только в отдельных случаях, в остальных — пропускаются. Комментарии созданы для удобства чтения кода страницы. Они открываются символами "<!--" и закрываются символами "-->". Комментарии могут содержать любые символы кроме символа "больше" ( > ).
Раздел 1. Введение: теги, HTML документ.
Раздел 2. Выделение текста - физические и логические стили.
Раздел 3. Форматирование текста.
Раздел 4. Ссылки.
Раздел 5. Рисунки.
Раздел 6. Цвет фона и текста. Шрифты.
Раздел 10. Изображения-карты (image maps).
Раздел 11. Звук на сайте.
Раздел 12. Каскадные таблицы стилей.
Раздел 13. Фреймы.
Тема: вкратце о CSS.Что такое CSS и для чего это нужно? CSS - Cascading Style Sheets, что означает дословно "каскадные таблицы стилей". Смысл - описывается стиль всего документа или сайта в целом, либо отдельных его элементов. Т.е. вы можете один раз определить, что, например, на всех страницах вашего сайта все заголовки будут красного цвета, абзацы выровнены по центру, а ссылки останутся неподчеркнутыми (то-то посетители помучаются, пока найдут их!). И к тому же вы сможете изменить стиль вашей страницы или даже всего сайта, подправив в тексте лишь пару строк!
Чтобы сразу объяснить суть таблиц стилей, рассмотрим пример. Допустим, у вас есть такая страница:
А теперь где-нибудь в заголовке страницы (т.е. в секции HEAD) разместим тэг <STYLE>:
Можете набрать этот пример в каком-либо текстовом редакторе и сохранить затем с расширением htm или html (хорошая практика!), а можете сразу посмотреть этот пример в действии.
Теперь разберем этот пример подробнее. Аттрибут TYPE="text/css" и информация в комментарии (между "<!--" и "-->") как раз и определяют стиль нашей страницы. Метки комментария здесь используются для совместимости со старыми версиями браузеров - они просто проигнорируют незнакомый тэг <STYLE> и содержимое комментария, и ваша страница будет показана как самая обычная HTML-страница. Строка H1 указывает браузеру, что всякий текст, находящийся между метками <H1> и </H1>, должен отображаться шрифтом helvetica, arial или sans-serif высотой в 40 пикселов на красном фоне и быть выровнен вправо. Строка H2 определяет, что шрифт в заголовках <H2> должен быть наклонным и высотой в 20 пикселов из семейства helvetica. И, наконец, строка P определяет поведение всех абзацев на странице: на сером фоне, выровнены по центру, шрифт - courier, fixed или monospace.
Вот и все. Как говорится, просто и со вкусом. Таким образом вы можете управлять проактически всем, что появляется на вашей странице. Т.е. практически любому тегу можно придать новые свойства. А теперь подробнее.
Font-family - шрифт, используемый для отображения данного элемента. В идеале, конечно, было бы неплохо, если бы у всех ваших посетителей были одинаковые наборы шрифтов. На практике же такого не бывает. Поэтому указывайте список шрифтов. Браузер просматривает этот список пока не встретит имеющийся в наличии шрифт. Например, компьютер с ОС Windows как правило имеет шрифт Arial, в компьютерах Macintosh наиболее похож на него шрифт Helvetica. В конце списка желательно иметь один из следующих: serif, sans-serif, monospace, fantasy или cursive. Пример: "P < font-family: arial, helvetica, sans-serif >"
Font-size - размер шрифта. Может указываться в точках (pt), пикселах (px).
Font-style: italic - курсив (наклонный шрифт).
Font-weight: bold - жирный шрифт. Значение может быть также числовым, только различные браузеры реагируют на это по-разному.
Text-transform - преобразование текста: допустимые значения: uppercase (все буквы будут заглавные), lowercase (все буквы будут строчные), capitalize (каждое слово будет начинаться с заглавной буквы) и none (т.е. никаких действий).
Text-decoration - выделение текста, допустимые значения: underline (подчеркнутый), line-through (перечеркнутый), blink (мигающий) и none(ничего). Например, чтобы ссылки в тексте не выделялись подчеркиванием, можно включить в заголовок документа следующий текст:
Color - изменение цвета текста, линий, рамок. Скажем, в предыдущем примере мы сделали так, что ссылки на странице не подчеркиваются. Чтобы они не выделялись еще и цветом, сделаем одинаковым цвет ссылок и текста (для краткости здесь и далее метки STYLE TYPE. будут опускаться): Т.е. цвет текста на странице - черный (1-я строчка), ссылки (обычно голубого цвета) - неподчеркнутые черного цвета (2-я строчка), посещенные ссылки (обычно фиолетовые) - также черного цвета и неподчеркнутые (3-я строчка).
Background-color - определяет цвет фона для какого-либо элемента. Например: strong
Background-image - позволяет сделать фон в виде рисунка. Пример: blockquote
Text-align - выравнивание текста. Применяется только в абзацах, заголовках и списках. А также для выравнивания картинок на страничке (несмотря на слово "text"). Например: IMG
Text-indent - позволяет делать отступ в первой строке абзаца (красная строка - как мы привыкли видеть в книгах). Ширина отступа измеряется в пикселах (px) или точках (pt). Может быть также величиной отрицательной, тогда первая строка будет выступать влево от остального текста. Пример (он же и применен к этому абзацу): p
Margin - устанавливает отступ текста. Пример использования: body
Программа
Учебник 7-9
Учебник
Презентации
ЕГЭ
Робототехника
Arduino
MMLogic
Исполнители
КуМир
Язык Си
Delphi
Photoshop
Flash
3D Gmax
HTML
Начало
Цвета
Текст
Абзацы
Гиперссылки
Списки
Рисунки
Таблицы
При установке структуры постоянных ссылок в виде "/%category%/%postname%.html " все ссылки на записи начинают заканчиваться на ".html ". Однако, этот формат ссылок никак не влияет на ссылки страниц. Что немного раздражает – подобной структурой ссылок мы подчеркиваем, что на нашем сайте является страницей, а что нет. Страница это то, что с ".html " в конце, а все остальное это рубрики, метки или еще какие другие таксономии. Ссылки на страницы в данном контексте выбиваются из общей картины – они кажутся ссылками на рубрики, хотя это и не так. Плагин Page_Htm эту неприятную ситуацию исправляет, добавляя ссылкам на страницы окончание ".html ".
Скачиваем плагин по ссылке в конце страницы и устанавливаем его:
1 Распаковываем архив.
2 Копируем файл page_htm.php в папку /wp-content/plugins/ .
3 Заходим в админку блога на вкладку "Плагины " и активируем плагин.
Настроек в плагине нет и сразу после своей активации он начинает работать. Теперь все ссылки на страницы превратятся из таких:
Вот в такие:
Но как быть в том случае, если вам надо изменить ".html " на ".htm " или вообще на ".php "? В плагине совсем нет никаких настроек, поэтому его придется отредактировать вручную. Для этого откройте файл плагина page_htm.php и измените в нем следующие строчки:
Создание Web-страниц. Изучение языка HTML.
HTML - Hyper Text Markup Language. Web-страница (документ HTML) представляет собой текстовый файл на языке HTML формата *.htm или *.html, размещенный в World Wide Web (WWW). WWW - Всемирная Паутина, распределенная система доступа к гипертекстовым документам, существующая в Интернете. Web-страница кроме текста может содержать гипертекстовые ссылки, при помощи которых можно переходить к другим Web-страницам и просматривать их. Web-страница может содержать вставки в виде графики, анимации, видеоклиппов и музыки.
Для просмотра Web-страниц можно использовать, например, MicroSoft Internet Explorer или NetScape Navigator, или Opera (просмотрщик или броузер).
Язык HTML позволяет:
1) Создавать и редактировать Web-страницы, в том числе свою домашнюю Web-страницу, которую можно затем разместить в Интернете;
2) Редактировать документы HTML, полученные из Интернета, так чтобы функционировали все внедренные в документ объекты (картинки, анимации и т.д.);
3) Создавать мультимедийные презентации, слайд-шоу, демонстрационные проекты, благодаря гипертекстовым ссылкам и возможности вставлять в документ HTML рисунки, диаграммы, анимации, видеоклипы, музыкальное и речевое сопровождение, текстовые спецэффекты (например, бегущая строка).
Существуют три основных способа создания Web-страниц (или документов HTML):
1) Использование текстового редактора Блокнот (NotePad), встроенного в Windows, и просмотр результатов с помощью броузера. Этот самый простой способ рекомендуется начинающим.
Технология этого способа создания Web-страницы такова:
В редакторе Блокнот создается файл Web-страницы, который сохраняется с расширением *.htm. Затем этот файл загружается и просматривается программой Internet Explorer. Для вызова редактора Блокнот с целью редактирования файла Web-страницы во время ее просмотра в Internet Explorer, используется пункт меню Вид, Источник или В виде HTML. После сохранения файла и выхода из Блокнота для просмотра отредактированной страницы надо нажать клавишу F5 или кнопку "Обновить" в панели инструментов Internet Explorer.
2) Использование специальных редакторов документов HTML, например Hot Metal Light, Hot Dog Professional, MS Front Page, HTMLPad и др.
3) Использование редактора Word-97, где создается текст документа, который затем конвертируется в HTML-формат.
Рассмотрим основные понятия языка HTML.
1. Элемент - это конструкция языка HTML, или контейнер, содержащий данные. Web-страница представляет собой набор элементов.
2. Тег - это стартовый и конечный маркеры элемента. Теги определяют границы действия элементов и отделяют элементы друг от друга. В тексте Web-страницы теги заключаются в угловые скобки, например: <HTML>. Конечный тег всегда снабжается косой чертой: </HTML>.
3. Гиперссылка - фрагмент текста, который является указателем на другой файл или объект. Гиперссылки позволяют переходить от одного документа к другому.
4. Фрейм - область гипертекстового документа со своими полосами прокрутки.
5. Апплет - программа, передаваемая на компьютер клиента в виде отдельного файла и запускаемая при просмотре Web-страницы.
6. Скрипт - программа, включенная в состав Web-страницы для расширения ее возможностей.
7. Загрузка (DownLoad) - копирование документа с Web-сервера на компьютер клиента.
UpLoad - копирование документа c компьютера клиента на Web-сервер - используется при создании собственной Web-страницы (т.е. при ее опубликовании).
Рассмотрим общую структуру типичного простейшего документа HTML:
<COMMENT>Комментарий</COMMENT>
<HTML>
<HEAD>
<TITLE>Название документа</TITLE>
Дадим пояснения указанным тегам документа HTML.
<COMMENT> или <!-- --> - Комментарий к документу. Он игнорируется
броузером. Комментарий не является обязательным и может отсутствовать.
<HTML> - идентификатор всего блока HTML-команд.
<HEAD> - идентификатор заголовка документа HTML.
<TITLE> - идентификатор заголовка окна просмотра.
<META> - этот непарный тег применяется для указания подробной
информации о документе.
<BODY> - идентификатор HTML-команд документа для просмотра.
Три основных тега <HTML>, <HEAD> и <BODY> передают броузеру
основную информацию для идентификации и организации документа.
Все указанные теги - парные, то есть каждый из них заканчивается
конечным тегом с косой чертой.
Все команды можно писать как с маленькой буквы, так и с большой.
Рассмотрим теги форматирования текстового потока:
<P> - идентификатор конца абзаца.
<BR> - идентификатор перевода строки.
<HR> - идентификатор изображения горизонтальной линии.
Эти теги одиночные, т.е. непарные, они не требуют тегов с косой
<PRE> - установка равноширинного шрифта. В конце нужен тег </PRE>.
Рассмотрим парные теги форматирования заголовков и подзаголовков
документа: <H1>, <H2>, <H3>, <H4>, <H5>, <H6>. При этом заголовки
будут выведены большими буквыми, причем размер букв у тега <H1>
будет самый большой, у <H2> меньше, у <H3> еще меньше и т.д.
Рассмотрим парные теги форматирования символов текста:
<B> - идентификатор полужирного шрифта.
<strong> - идентификатор выделенного шрифта.
<i> - идентификатор курсива.
<U> - идентификатор подчеркивания.
<s> - идентификатор перечеркивания.
Рассмотрим теги форматирования абзацев:
<p align=left> - выравнивание текста в абзаце по левому краю.
<p align=right> - выравнивание текста в абзаце по правому краю.
<p align=center> - выравнивание текста в абзаце по центру.
<p align=justify> - полное выравнивание по обоим краям экрана.
align - атрибут выравнивания.
Рассмотрим теги списков.
Они являются способом наглядного отображения структурированной информации.
Упорядоченные списки служат для отображения последовательных
операций или алгоритмов. Броузер автоматически генерирует номера
для каждого пункта в списке.
<OL> - идентификатор упорядоченного списка. В конце </OL>.
Неупорядоченные списки служат для составления перечней, когда
порядок следования пунктов несущественен. Перед каждым элементом
будет стоять специальный списочный значок (точка).
<UL> - идентификатор неупорядоченного списка. В конце </UL>.
Отдельные элементы в упорядоченном и неупорядоченном списках
помечают одиночным тегом <LI>, а элементы в списках определений
<DL> тегами <DT> для термина и <DD> для значения термина.
<LI> - идентификатор элемента в упорядоченном и неупорядоченном списке.
Конечный тег </LI> может быть опущен.
Списки определений обеспечивают специальное форматирование, как
Про тег <TITLE> можно сказать немного. Пишете там название темы Вашей страницы (например risunki, yumor,ssilki. ) и все. Все, что Вы здесь напишете, отобразится в заголовке окна браузера (желательно по-короче, чтобы все это поместилось на экране).
А вот про остальные теги разговор особый. Щелкая по ссылкам в этой таблице, Вы узнаете как использавать еще кучу других тегов чтобы построить свою WEB-страницу или даже целый сайт.Вообще таблица эта, на первое время, станет вашим основным инструментом. Самая разветвленная ее часть - это, конечно, Тело страницы. Если, к примеру, Вам нужно вставить текст, да к тому же, оформить его каким-либо щрифтом или цветом, Вам необходимо зайти в Тело страницы. далее найти ссылку Текст. где и будет рассказано как все это делается. Если же нужно вставить таблицу, рисунок или еще что-то - поступайте аналогично - Тело страницы. далее нужную ссылку.
Так с чего же начать? А начнем мы пожалуй с того, что откроем себе новую папку и назовем ее, к примеру, Мой сайт. Здесь и будем располагать все свои WEB-странички. Потом, (в недалеком будущем) связав все эти странички ссылками, мы получим единый сайт. Останется закинуть папочку Мой сайт на какой-либо сервер и (Ура. ) Ваш сайт в Сети!
Ну а пока что, скопировав какую-либо WEB-страничку в нашу новую папку Мой сайт. откроем ее. Затем откроем код страницы (напомню, в меню Вид нужно выбрать в виде HTML или на панели инструментов на кнопочке Правка выбрать Править в Блокнот ). Откроется текстовый редактор Блокнот. Здесь нужно удалить все, кроме основных тегов, тех, что в нашей таблице, причем параметры в тегах <META> и <BODY> можно пока оставить, а в тегах <TITLE> сразу вписать тему Вашей странички.
Теперь все это нужно сохранить - в меню Файл (Блокнота!) выбираем Сохранить. а на панели инструментов Explorera (в окне браузера) - Обновить. Все, что раньше было на странице (тексты, рисунки и т.д.) исчезнет, будет лишь белый экран - своего рода, чистый лист бумаги. Можно теперь сохранить эту чистую страничку как шаблон для новых страничек, т.е. берем потом копию этой страницы, открываем ее код, вводим тексты, вставляем рисунки, ссылки и т.д. а потом сохраняем с другим именем. Но можно использовать и другие шаблоны. К примеру, взгляните на мой сайт, а там на раздел анегдоты. как видите, все странички практически одинаковы, т.е. достаточно сделать одну страничку какого-либо раздела, а потом брать ее копию, как за основу новой страницы. Достаточно в коде страницы, в ее теле. удалить старый текст, а вместо него вставить новый. Потом сохранить все это под новым именем. Так можно сделать кучу новых страниц, а связав их ссылками, объединить в раздел. Ну а связав ссылками разделы, получим полномасштабный сайт.
Вот в кратце и все. Больших Вам успехов!
В первую очередь необходимо создать страницу (сайт) поэтому с этого и начнем. О содержании и оформлении сайта я говорить не буду, здесь каждый смотрит на это по своему. Поговорим о самой технологии простейшего HTML (аббревиатура Hyper Text Markup Language).
В самом теле HTML ничего кроме команд (в HTML они разделяются на понятия "Тэг" и "Параметры") и текста нет. Все рисунки, фотографии и прочую графику, которую вы можете видеть на сайтах, HTML-документ не содержит. Он содержит лишь ссылки на графические объекты. Сам HTML-документ это простой текстовый файл с расширением (типом) .htm или .html, который может редактироваться в обычном текстовом редакторе (например Notepad для Windows). Не забывайте, что в операционной системе UNIX, установленной на большинстве интернет-серверов, в названиях файлов важен регистр букв, в отличии от Windows. Например index.htm, Index.htm, index.HTM три разных файла.
Язык HTML создавался для интернет, как простейшее средство интерактивного общения. Основным его преимуществом перед обычными текстами является наличие ссылок. Они отличаются от основного текста например цветом. При клике на эту ссылку вы попадете на другую страницу.
Вот так и реализован основной принцип гипертекста.
Кодировка документовHTML-документы могут иметь различную кодировку. Вы наверное уже сталкивались с подобной проблемой пытаясь открыть текстовый файл написанный в DOS простым редактором Windows. Появлялись нечитабельные символы вместо русских букв (кириллицы). С латинскими символами все в порядке в любой кодировке, они всегда стоят в определенном постоянном месте любой кодовой таблицы (от 0 до кода 127 все символьные таблицы одинаковы (в них знаки препинания и латинский алфавит, область от 128 до 255 отведена под национальные алфавиты), а кириллица в разных кодовых таблицах имеет разное положение. В интернет существуют 4 основных типа кодовых таблиц для русской кириллицы:
Есть и другие кодировки, использующиеся не так часто (например UTF (Unix Text Format) почти как Windows, Mac (Macintosh)). Так или иначе, если вы будете писать HTML-документ в обычном текстовом редакторе, то его кодировка будет такая же, какую и использует этот редактор. Впоследствии готовые документы можно преобразовать в любой формат при помощи специальных программ-перекодировщиков .
Конструкция HTMLКак уже говорилось выше HTML-документы могут содержать в себе только текст. Текст в специальной конструкции, которая и отличает HTML от обычного текста, называется тэгом. Вот конструкция тэга:
<tag param="value">Другие теги и (или) текст внутри этого тега </tag>
Рассмотрим эту конструкцию подробнее.
Как видно из вышеописанного тело HTML-документа использует только определенный набор специальных символов. Конструкция тега может "ломаться" enter`ом, любым количеством пробелов (разумеется не в середине слова, броузер удалит все пробелы в серии кроме одного, так что выравнивать текст пробелами не получится) и табуляцией. Вид документа в броузере от этого не зависит. Для него символом перевода строки служит тег <br> (этот тег "неполноценный", у него нет окончания, а значит внутри него ничего не может быть), конец тега абзаца </p> или конец окна броузера (либо конец таблицы). Табуляции в HTML вообще нет, есть только отступ. А с лишними пробелами броузер поступает как я уже сказал. Существует специальный тег предварительного форматирования <pre>. Все, что внутри этого тега, будет отображено именно так как введено.
Существует способ отображения в HTML-документах спецсимволов. Просто они заменяются набором литер в конструкции "&;". Вот они:
Остальные символы пишутся в своем естественном виде. Хотя можно все символы писать ввиде их цифрового кода, например: ; означает символ ";" (или %59 если используется кодировка UTF-8), так же как например chr$(59) в бейсике. Но это важно в основном для HTML-документов выдаваемых программами.
В любом HTML-документе имеются обязательные теги, которые присутствуют в любом документе. В первую очередь это тег <html>, который стоит самым первым и сообщает броузеру, что данный файл следует интерпретировать как HTML-документ. Конец этого тега (</html>) означает и конец документа. Так-что весь документ лежит в теге <html>. Правда большинство современных броузеров уже не нуждаются в таких пояснениях и могут обойтись без этого тега. Все равно лучше его всегда ставить.
Второй обязательный тег это <head> - "головка" документа. Внутри него описываются стартовые установки для броузера, но может не быть ничего, тогда используются установки по умолчанию. Например название <title>Название документа</title> вынудит броузер вставить в название окна текст "Название документа". Здесь же описываются мета-переменные. Например <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> указывает броузеру кодировку HTML-документа. В нашем примере это Win-1251. Тег <meta> тоже не имеет конца, как и <br>, все ограничивается его параметрами.
Кстати вышеуказанную мета-переменную рекомендую использовать всегда. Если ее не указать, то броузер будет использовать текущую кодировку. То есть если на эту страницу вошли со страницы в кодировке KOI8-R, то и эта страница отобразится в этой же кодировке, а значит вы увидите нечитаемые символы. И никакой Apache на сервере не спасет.
После окончания тега </head> начинается то, что должно быть отражено на экране. Все это находится в теге <body>. Данный тег может иметь параметры, цвет фона (и)или фоновую картинку, стандартный цвет текста, стандартные цвета ссылок (цвет ссылки, цвет просмотренной ссылки, цвет активной ссылки) и т.п. Какие параметры не указаны, те устанавливаются по умолчанию из настроек броузера. Например в большинстве случаев цвет фона - белый, цвет текста - черный, цвет ссылки - синий, цвет просмотренной ссылки - фиолетовый, цвет текущей ссылки - красный. Вообще большинство неуказанных параметров заменяются броузерами на свои установки по умолчанию.
Кстати цвета в HTML удобнее указывать шестнадцатеричными числами. Перед числом цвета ставится символ "#". Например #FFFFFF - белый, а #000000 - черный.
Теперь мы с вами можем создать простейшую интернет-страницу. Например:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=koi8-r">
<title>Пример HTML-страницы</title>
</head>
<body bgcolor="#0000FF" text="#FFFFFF">
<p>Это первый абзац документа.</p>
<p align="center">А <font color="#00FF00">это</font> второй <strong>абзац
