HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартизированный язык гипертекстовой разметки документов для просмотра веб-страниц в браузере.
HTML позволяет форматировать текст, различать в нем функциональные элементы, создавать гиперссылки, вставлять изображения и т.д.
HTML — Элементы (теги)
HTML-теги — основа языка HTML. Теги используются для разграничения начала и конца элементов в разметке. Каждый HTML-документ состоит из дерева HTML-элементов и текста. Каждый HTML-элемент обозначается тегом.
Синтаксис:
Типы тегов
Каждый тег HTML принадлежит к определенной группе тегов, например, табличные теги направлены на формирование таблиц и не могут применяться для других целей.
Условно теги делятся на следующие типы:
- теги верхнего уровня;
- теги заголовка документа;
- блочные элементы;
- строчные элементы;
- универсальные элементы;
- списки;
- встраиваемые объекты
- таблицы;
- фреймы.
-
и
и относятся к категории списков, но также являются и блочными элементами.
HTML — язык разметки. Обзор и описание основных тегов.
Блочные элементы
Блочные элементы являются основой, которая используется для верстки веб-страниц. Такой элемент представляет собой прямоугольник, который по умолчанию занимает всю доступную ширину страницы (если иное значение не указано в CSS), а длина элемента зависит от его содержимого. Такой элемент всегда начинается с новой строки, то есть, располагается под предыдущим элементом. Блочный элемент может содержать в себе другие блочные и строчные элементы.
Примеры блочных элементов
, , , и т. д.
Строчные элементы
В отличие от блочного, строчный элемент не переносится на новую строку, а располагается на той же строке, что и предыдущий элемент. Такие элементы, как правило, находятся внутри блочных элементов и их ширина зависит лишь от содержимого и настроек CSS. Еще одно отличие строчного элемента от блочного заключается к том, что в нем может находиться только контент и другие строчные элементы. Блочные элементы в строчные вкладывать нельзя.
Примеры строчных элементов: span> , , , и т. д.
Источник: igsinter.net
21. Язык гипертекстовой разметки html
HyperText Markup Language(HTML) – язык разметки гипертекста – предназначен для написания гипертекстовых документов, публикуемых в World Wide Web.
Гипертекстовый документ– это текстовый файл, имеющий специальные метки, называемые тегами, которые впоследствии опознаются браузером и используются им для отображения содержимого файла на экране компьютера. С помощью этих меток можно выделять заголовки документа, изменять цвет, размер и начертание букв, вставлять графические изображения и таблицы. Но основным преимуществом гипертекста перед обычным текстом является возможность добавления к содержимому документагиперссылок– специальных конструкций языка HTML, которые позволяют щелчком мыши перейти к просмотру другого документа.
ЯЗЫК РАЗМЕТКИ HTML ЗА 40 МИНУТ ДЛЯ НАЧИНАЮЩИХ. ВСЕ ТЕГИ ВКЛЮЧЕНЫ.
Существует два способа создания гипертекстовых документов. Можно воспользоваться одним из WYSIWYG HTML-редакторов (например, Microsoft FrontPage, или др.), для работы с которыми не требуется специальных знаний о внутренней структуре создаваемого документа. Этот способ позволяет создавать документы для WWW без знания языка HTML.
HTML-редакторы автоматизируют создание гипертекстовых документов, избавляют от рутинной работы. Однако их возможности ограничены, они сильно увеличивают размер получаемого файла и не всегда полученный с их помощью результат соответствует ожиданиям разработчика. Но, безусловно, этот способ незаменим для новичков в деле подготовки гипертекстовых документов.
Альтернативой служит создание и разметка документа при помощи обычного редактора текста (NotePad). При этом способе в текст вручную вставляются команды языка HTML. Создавая документы таким способом, вы точно знаете, что делаете.
Как уже отмечалось, HTML-документ содержит символьную информацию. Одна ее часть — собственно текст, т. е. данные, составляющие содержимое документа. Другая – теги(markup tags), называемые такжефлагами разметки, – специальные конструкции языка HTML, используемые для разметки документа и управляющие его отображением.
Именно теги языка HTML определяют, в каком виде будет представлен текст, какие его компоненты будут исполнять роль гипертекстовых ссылок, какие графические или мультимедийные объекты должны быть включены в документ. Графическая и звуковая информация, включаемая в HTML-документ, хранится в отдельных файлах. Программы просмотра HTML-документов (браузеры) интерпретируют флаги разметки и располагают текст и графику на экране соответствующим образом. Для файлов, содержащие HTML-документы, приняты расширения .htm или .html.
Прописные и строчные буквы при записи тегов не различаются.В большинстве случаев теги используются парами. Пара состоит из открывающего (start tag) и закрывающего (end tag) тегов. Синтаксис открывающего тега:
Прямые скобки, используемые в описании синтаксиса, означают, что данный элемент может отсутствовать. Имя закрывающего тега отличается от имени открывающего лишь тем, что перед ним ставится наклонная черта:
Атрибуты тега записываются в следующем формате:
Кавычки при задании значения аргумента не обязательны и могут быть опущены. Для некоторых атрибутов значение может не указываться. У закрывающего тега атрибутов не бывает.
Действие любого парного тега начинается с того места, где встретился открывающий тег и заканчивается при встрече соответствующего закрывающего тега. Часто пару, состоящую из открывающего и закрывающего тегов, называют контейнером, а часть текста, окаймленную открывающим и закрывающим тегом, –элементом.
Структура HTML-документа
Самым главным из тегов HTML является одноименный тег – . Он должен всегда открывать ваш документ, так же, как тег должен непременно стоять в последней его строке. Эти теги обозначают, что находящиеся между ними строки представляют единый гипертекстовый документ. Без этих тегов браузер или другая программа просмотра не в состоянии идентифицировать формат документа и правильно его интерпретировать.
Закрывающий тег так же важен, как и открывающий. Если, например, документ включен в электронное письмо, тег дает команду программе просмотра прекратить интерпретацию текста, как HTML-кода.
HTML-документ состоит из двух частей: заголовок (head) и тело (body), расположенных в следующем порядке:
В HTML-документ можно включать комментарии, позволяющие скрыть часть текста от браузера. Все, что заключено между последовательностями символов , при просмотре страницы остается невидимым. Комментарии не могут быть вложенными друг в друга
Включение в документ заголовочной части не является обязательным. Задачей заголовка является представление необходимой информации для браузера и сервера HTTP. Информация, размещенная внутри заголовка документа, обычно не выводится на экран (кроме названия документа).
Чаще всего в заголовок документа включают парный тег . , определяющий название документа. Многие программы просмотра используют его как заголовок окна, в котором выводят документ. Программы, индексирующие документы в сети Интернет, используют название для идентификации страницы.
Хорошее название должно быть достаточно длинным для того, чтобы можно было корректно указать соответствующую страницу, и в то же время оно должно помещаться в заголовке окна. Название документа вписывается между открывающим и закрывающим тегами. Тело документа
В отличии от заголовка, тело документа является обязательным элементом, так как в нем располагается весь материал вашего документа (есть только одно исключение, с которым мы познакомимся далее, — когда документ содержит вместо тела группу фреймов). Тело документа размещается между тегами и . Все, что размещено между этими тегами, интерпретируется браузером в соответствии с правилами языка HTML, позволяющими корректно отображать страницу на экране монитора.
Тег не только обозначает начало содержимого документа, но и задает его основные свойства: цвет фона, текста и многое другое. Эти свойства определяются с помощью атрибутов, которые приведены в таблице.
Определяет цвет активной ссылки
Источник: studfile.net
Язык разметки гипертекстов html
Документы, хранящиеся на WWW, подготавливаются на специальном языке HTML ( Hypertext Markup Language — «Язык разметки гипертекстов»). В HTML текст кодируется в ASCII и поэтому может быть создан и отредактирован в любом текстовом редакторе. Кроме самого текста в документах имеются флаги разметки, которые интерпретируются клиентской программой просмотра (броузером) и позволяют воспринимать документ именно как гипертекст.
Любой гипертекст похож на книгу и может быть разбит на отдельные структурные элементы:
• главы, параграфы, пункты, подпункты;
Для каждого из этих элементов в HTML существуют определенные стили, описывающие, в каком виде пользователь увидит текст на экране. Пусть мы создали файл minihtml.html:
Добро пожаловать в HTML!
Это пример гипертекста .
Из данного примера видно, что
• заголовок документа начинается с и заканчивается ;
• заголовок первого уровня (главы) выделяется символами <Н1>и ;
•заголовки последующих уровней (параграфы, пункты, подпункты ит.п.) -символами <Нх>и , где х — числа 2,3.
Не все стили поддерживаются всеми WWW-броузерами. Если программа просмотра не поддерживает стиль, то она его игнорирует.
Основной текст отделяется от сопроводительного символами
Для выделения заголовка служат символы
HTML имеет шесть уровней заголовков, имеющих номера с 1 по 6 (заголовок первого уровня является заголовком высшего уровня). По сравнению с нормальным текстом, заголовки выделяются шрифтом — размером и толщиной букв. Первый заголовок в каждом документе должен быть выделен . Синтаксис заголовков:
где у — число от 1 до 6, определяющее уровень заголовка.
В отличие от документов, в большинстве текстовых процессоров прерывания строк и слов в HTML-файлах несущественны. Обрыв слова или строки может происходить в любом месте в исходном файле, при просмотре это прерывание будет проигнорировано. Напомним, что в нашем примере, первый параграф был представлен как
Добро пожаловать в HTML!
Это пример гипертекста.
В исходном файле два предложения находятся на двух разных строках. Программа просмотра игнорирует это прерывание строки и начинает новыйабзацтолько,после знака .
Главное преимущество HTML состоит в его способности связываться с другими документами. Броузер выделяет (обычно цветом и/или подчеркиванием) ключевые слова, являющиеся гипертекстовыми ссылками (гиперссылками). Описывается ссылка на другой документ следующим образом:
Текст, который будет служить как обращение к другому документу. Приведем пример такой гипертекстовой ссылки:
Здесь ключевые слова «Пример HTML-текста» являются гиперссылкой на файл minihtml.html, который находится в той же директории, что и текущий документ. Также можно ссылаться на документ в любой директории, описав к нему полный путь. Например, ссылку на файл NJStais.html, лежащий в поддиректории AtlanticStates, можно описать так:
Это — так называемые относительные ссылки. Можно также использовать абсолютное имя файла (полный путь). В общем случае, использование ссылкипоабсолютному имени файла более предпочтительно.
Ссылки на документы, хранящиеся на других серверах, записываются суказанием их URL:
Гиперссылки могут также использоваться для соединения с определенными разделами документов. Предположим, необходимо соединить документ А с первой главой документа В. Для этого надо создать именованную гиперссылку в документе В:
Здесь вы можете увидеть
<А NAME = «Глава 1»>Главу 1 текст первой главы.
Теперь, описывая ссылку в документе А, надо включить не только имя файла documentB.html, но также и имя гиперссылки, отделяемое символом (#):
Здесь вы можете увидеть текст
Теперь «кликнув» в слово «Главы I» в документе А, можно перейти непосредственно в Главу 1 в документе В.
Техника соединения с разделами текущего документа аналогична описанной выше, только опускается имя файла. Вот, например, связь с Главой 1 внутри того же самого файла (Документ В):
Это <А HREF = «#Глава1»>Глава 1 текущего документа.
Для более сложных документов HTML имеет некоторые дополнительные возможности форматирования Так, HTML поддерживает ненумерованные и нумерованные списки. Ненумерованный список.
Источник: studopedia.ru