Введение в HTML
Литература.
Владимир Дронов HTML 5, CSS 3 и Web 2.0. Разработка современных Web‑сайтов.
М.Э. Хольцшлаг «Использование HTML 4»
Ссылки на сайты
https://www.htmlbook.ru/
https://ru.html.net/tutorials/html/
https://html.manual.ru/
https://pyramidin.narod.ru/html401/index.htm
Чтобы представить информацию для глобального использования, нужен универсальный язык, который понимали бы все компьютеры. Языком публикации, используемым в World Wide Web, является HTML (HyperText Markup Language - язык разметки гипертекстов).
| Версия HTML | Год выхода | Особенности |
| 1.0 | Официально не была стандартизирована | |
| 2.0 | Первая стандартизованная версия | |
| 3.2 | Поддержка таблиц и графики | |
| 4.0 | Очищен от устаревших тегов | |
| 4.1 | В основном, исправление ошибок | |
| 5.0 | Удалены фреймы (кроме IFRAME) и другие, а также добавлено много новых тегов. Последняя версия HTML. Далее исправления в спецификацию будут вноситься рабочим порядком. |
В HTML документы записываются в ASCII формате и поэтому могут быть созданы и отредактированы в любом текстовом редакторе. Файлам присваивается имя: название.html. Обычно главный файл WEB-узла имеет имя index.html.
Любой гипертекст похож на книгу и может быть разбит на отдельные структурные элементы:
· Собственно документ
· Главы, параграфы, пункты, подпункты
· Абзацы
Дескрипторы – управляющая информация – выделяются символами < >. После имени дескриптора (тега) может следовать атрибут (параметр) через пробел. Параметру может присваиваться значение с помощью знака равенства. Значение, как правило, берется в кавычки. Теги и параметры могут набираться как прописными, так и строчными буквами, так как HTML не чувствителен к регистрам.
Структура документа HTML:<!DOCTYPE html>
HEAD элемент содержит информацию о текущем документе, как например, название, ключевые слова, которые могут быть полезными для поисковых систем, и другие данные, которые не считаются содержанием документа.Каждый HTML документ должен иметь элемент TITLE в HEAD разделе. Авторы должны использовать элемент TITLE, чтобы идентифицировать содержимое документа. Он отображается в заголовке браузера. Комментарий:<!— текст комментария -->
Цветовые атрибуты элемента BODY:
bgcolor = color; фон
text = color; текст
background =url; фоновое изображение
Пример:
<BODY bgcolor="white" text="black" >
Существует 136 предопределенных имен цветов.
Названия цветов.
· Black = черный;
· Silver = серебристый;
· Gray = серый;
· White = белый;
· Maroon = коричневый;
· Red = красный;
· Purple = пурпурный;
· Fuchsia = фуксия;
· Green = зеленый;
· Lime = ярко-зеленый;
· Olive = оливковый;
· Yellow = желтый;
· Navy = темно-синий;
· Blue = ярко-синий;
· Teal = сине-зеленый.
Цветовую карту со всеми 136 именами цветов можно найти по адресу:
https://www.molly.com/molly/webdesign/136_colors.html
Цвета можно задавать в шестнадцатеричной форме шестью разрядами (text=”#000000”).
Другие параметры тега BODY приведены ниже:
- BOTTOMMARGIN= граница нижнего поля документа в пикселах
- BGPROPERTIES= Если установлено значение FIXED, фоновое изображение не прокручивается
- LEFTMARGIN=граница левого поля документа в пикселах
- RIGHTMARGIN=граница правого поля документа в пикселах
- SCROLL= Устанавливает наличие или отсутствие полос прокрутки окна браузера
- TOPMARGIN=граница верхнего поля документа в пикселах.
<DIV> - раздел (используется для деления BODY на части для изменения параметров)
…
</DIV>
При разделении на части используется метод контейнеров, когда каждая внутренняя форма полностью помещается в наружной. Внутри DIV может использоваться выравнивание текста. Текст, выделенный тегом DIV, на экране начинается с новой строки.
<SPAN> – отличается от тега DIV тем, что не изменяет текст на экране, а создаёт логический блок, который может быть использован с помощью обычных (align) или стилевых параметров.
</SPAN>
Выравнивание текста.
ALIGN - параметр выравнивания
align=” center ” параметр выравнивания по центру
align=” left ” по левому краю (по умолчанию)
align=” right ” по правому краю
align=” justify ” по ширине (по обоим краям)
Текст, содержащийся в элементе BODY, после обработки браузером теряет концы строк и повторяющиеся пробелы. По умолчанию он прижат влево. Для его форматирования используются нижеследующие элементы.
Элементы логического форматирования
<P> текст </P> абзац (пустая строка и переход на новую) закрывающий необязателен
может использовать параметры выравнивания и другие.
<BLOCKQUOTE> текст</BLOCKQUOTE> Блок с отступом (цитата) похож на абзац
<H1> заголовок 1-го уровня </H1> самый крупный (размер шрифта)
…
<H6> заголовок 6-го уровня </H6> самый мелкий
<EM> акцент в тексте </EM> выделение текста (обычно курсив)
<STRONG> более сильный акцент в тексте </STRONG> (обычно полужирный)
<CITE> цитата или название книги </CITE> (обычно курсив)
< CODE > фрагмент кода (команда)</CODE> (отображается моноширинным шрифтом)
< DEL > отмечает свой текст как удаленный</DEL>(обычно зачеркнутый)
< INS > отмечает свой текст как вставку</INS>(обычно подчеркнутый)
<ABBR> аббревиатура </ABBR>(обычно подчеркнутый)
<SMALL> уменьшенный шрифт</SMALL>
<DFN> новый термин </DFN>(обычно курсив)
<KBD> данные вводимые пользователем </KBD>(отображается моноширинным шрифтом)
<Q> небольшая цитата </Q> (обычным шрифтом)
<SAMP> данные вводимые какой-либо программой </SAMP>(отображается моноширинным шрифтом)
<VAR> имя переменной </VAR>(обычно курсив)
<PRE>
текст не требующий форматирования (возможны и пустые строки), сохраняются все пробелы и концы строк
</PRE>
В пределах <PRE> могут использоваться гиперссылки. Однако, в пределах <PRE>, необходимо избегать использовать другие методы форматирования.
<ADDRESS> ФМИ /ТНУ /dekanat@fmi.tnu.edu </ADDRESS>
используется для адреса автора, обычно в конце документа (выделяется курсивом).