Сайт о телевидении

HTML-теги — основа языка HTML. Теги используются для разграничения начала и конца элементов в разметке.

Каждый HTML-документ состоит из дерева HTML-элементов и текста. Каждый HTML-элемент обозначается начальным (открывающим) и конечным (закрывающим) тегом. Открывающий и закрывающий теги содержат имя тега.

Все HTML-элементы делятся на пять типов:

• пустые элементы — , ,
  , , , , , ,
  Используется для хранения дополнительной информации о странице. Эту информацию используют браузеры для обработки страницы, а поисковые системы — для ее индексации. В блоке может быть несколько тегов , так как в зависимости от используемых атрибутов они несут разную информацию. Индикатор измерения в заданном диапазоне. Раздел документа, содержащий навигационные ссылки по сайту. Определяет секцию, не поддерживающую сценарий (скрипт). Контейнер для встраивания мультимедиа (например, аудио, видео, Java-апплеты, ActiveX, PDF и Flash). Также можно вставить другую веб-страницу в текущий HTML-документ. Для передачи параметров встраиваемого плагина используется тег . Упорядоченный нумерованный список. Нумерация может быть числовая или алфавитная. Контейнер с заголовком для группы элементов . Определяет вариант/опцию для выбора в раскрывающемся списке , или . Поле для вывода результата вычисления, рассчитанного с помощью скрипта.

  Параграфы в тексте. Определяет параметры для плагинов, встраиваемых с помощью элемента . Элемент-контейнер, содержащий один элемент и ноль или несколько элементов . Сам по себе ничего не отображает. Дает возможность браузеру выбирать наиболее подходящее изображение. Выводит текст без форматирования, с сохранением пробелов и переносов текста. Может быть использован для отображения компьютерного кода, сообщения электронной почты и т.д. Индикатор выполнения задачи любого рода. Определяет краткую цитату. Контейнер для Восточно-Азиатских символов и их расшифровки. Определяет вложенный в него текст как базовый компонент аннотации. Добавляет краткую характеристику сверху или снизу от символов, заключенных в элементе , выводится уменьшенным шрифтом. Отмечает вложенный в него текст как дополнительную аннотацию. Выводит альтернативный текст в случае если браузер не поддерживает элемент . Отображает текст, не являющийся актуальным, перечеркнутым. Используется для вывода текста, представляющего результат выполнения программного кода или скрипта, а также системные сообщения. Отображается моноширинным шрифтом. Используется для определения сценария на стороне клиента (обычно JavaScript). Содержит либо текст скрипта, либо указывает на внешний файл сценария с помощью атрибута src . Определяет логическую область (раздел) страницы, обычно с заголовком. Элемент управления, позволяющий выбирать значения из предложенного множества. Варианты значений помещаются в . Отображает текст шрифтом меньшего размера. Указывает местоположение и тип альтернативных медиаресурсов для элементов , , . Контейнер для строчных элементов. Можно использовать для форматирования отрывков текста, например, выделения цветом отдельных слов. Расставляет акценты в тексте, выделяя полужирным. Подключает встраиваемые таблицы стилей. Задает подстрочное написание символов, например, индекса элемента в химических формулах. Создаёт видимый заголовок для тега . Отображается с закрашенным треугольником, кликнув по которому можно просмотреть подробности заголовка. Задает надстрочное написание символов.

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

  HTML 4.x

  Я не могу найти упоминания этого синтаксиса в спецификации HTML 4.x. Это недопустимый синтаксис.

  В спецификации HTML 5 символ / (называемый SOLIDUS) действителен, но не действует для элементов void, таких как
  , , , и т.д., а для внешних элементов (таких как теги SVG) он обозначает начальный тег который обозначается как самозакрывающийся. Это не является допустимым синтаксисом для всех других тегов (например, , упомянутых в вашем вопросе).

  Затем, если элемент является одним из элементов void или элемент является внешним элементом, тогда может быть один символ U + 002F SOLIDUS (/). Этот символ не влияет на элементы void, но на чужие элементы он отмечает начальный тег как самозакрывающийся .

  В соответствии с спецификацией XML он называется тегом empty-element:

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

  В соответствии с спецификацией XHTML он называется синтаксисом минимизированных тегов для пустых элементов:

  С.2. Пустые элементы

  Включить пробел перед конечными/и > пустыми элементами, например. < br/ " > , < hr/" > и < img src= "karen.jpg" alt= "Karen" / " > . Кроме того, используйте минимизированный синтаксис тегов для пустых элементов, например. < br/" > , поскольку альтернативный синтаксис
  
  , разрешенный XML, дает неопределенные результаты во многих существующих пользовательских агентах.

  С.3. Элемент Минимизация и содержимое пустого элемента

  Для пустого экземпляра элемента, модель содержимого которого не является EMPTY (например, пустой заголовок или абзац), не используйте свернутую форму (например, используйте и не < p/" >).

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

  Благодаря Alohci для справки HTML 5.

  Для структурирования и оформления текста применяются теги — специальные ключевые слова, обрамленные в скобки < и > . Большинство из них имеют закрывающую пару с косой чертой «/» перед именем тега. Это позволяет обозначать определенные части текста. Например:

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

  Некоторые теги не предназначены для выделения области текста, а отвечают за какой-либо одиночный элемент документа (например, изображение или кнопку). Такие теги не требуют закрывающей пары, а косая черта «/» ставится перед закрывающей скобкой тега. Например,
  (перенос строки) или (горизонтальная линия). Такие одиночные теги называют пустыми, в то время как парные — непустыми, или контейнерами.

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

  Синтаксис и механизм представлений

  Напомним, что одной из функций механизма представлений HTML 5 является обеспечение совместимости нового стандарта с уже существующими HTML/XHTML-документами. Это происходит благодаря наличию трех «режимов» (HTML5, XHTML5, DOM5 HTML) интерпретатора, каждый из которых поддерживает свой синтаксис.

  Вообще говоря, стандартом HTML разрешается набирать теги в любом регистре. Кроме того, можно опускать некоторые закрывающие теги (и косую черту в одиночных тегах). В HTML 5 это тоже допустимо (синтаксис представления HTML5), но такой код не будет совместим с синтаксисом XML /XHTML, что делает затруднительным применение XML-совместимых технологий, таких как, например, микроформаты. По этой причине мы рекомендуем писать код, используя синтаксис XHTML (документ интерпретируется в представлении XHTML5). Исходя из этого и будет вестись дальнейшее изложение.

  Для совместимости со старыми браузерами, которые не понимают синтаксис XHTML, в одиночных тегах желательно оставлять пробел между именем и косой чертой «/», хотя это скорее полезная привычка, чем правило:

  Правило вложенности тегов

  Парные теги (контейнеры) могут содержать не только текст, но и другие теги. При этом действует одно правило — теги должны закрываться в порядке, обратном тому, в котором они открывались. Обратите внимание на расположение тегов в следующем примере:

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

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

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

  Любой открывающий (или пустой) тег может содержать атрибуты, определяющие некоторые дополнительные свойства всего элемента. Атрибуты прописываются сразу после имени тега, отделяясь от него и друг от друга пробелом:

  Ссылка на сайт

  В этом примере мы указали тегу (гиперссылка) два атрибута. Первому (href), отвечающему за адрес ссылки, мы присвоили значение http://www.example.com/ . Значение _blank атрибута target означает, что при нажатии на ссылку указанная в href страница должна открываться в новой вкладке браузера.

  Некоторые атрибуты могут иметь только одно допустимое значение и всего два возможных состояния — когда атрибут присутствует в элементе и, соответственно, когда отсутствует. В этом курсе такие атрибуты, по аналогии с переменными в математике, называются булевыми. Значение булева атрибута обычно совпадает с его названием. Например, disabled="disabled" . Вообщя говоря, их можно опускать, указывая только название атрибута (т. н. сокращенные атрибуты). Однако для совместимости с синтаксисом XHTML/XML значения указывать все же обязательно. Кроме того, названия всех атрибутов необходимо набирать в нижнем регистре и заключать их значения в двойные кавычки, хотя HTML 5 и не ставит такого ограничения.

  Тег для создания таблицы.
  	Определяет тело таблицы.
  		Создает ячейку таблицы.
  	Используется для объявления фрагментов HTML-кода, которые могут быть клонированы и вставлены в документ скриптом. Содержимое тега не является его дочерним элементом.
  	Создает большие поля для ввода текста.
  	Определяет нижний колонтитул таблицы.
  	Создает заголовок ячейки таблицы.
  	Определяет заголовок таблицы.
  	Определяет дату/время.
  	Заголовок HTML-документа, отображаемый в верхней части строки заголовка браузера. Также может отображаться в результатах поиска, поэтому это следует принимать во внимание предоставление названия.
  Создает строку таблицы.
  	Добавляет субтитры для элементов и .
  	Выделяет отрывок текста подчёркиванием, без дополнительного акцента.
  	Создает маркированный список.
  	Выделяет переменные из программ, отображая их курсивом.
  	Добавляет на страницу видео-файлы. Поддерживает 3 видео формата: MP4, WebM, Ogg.
  	Указывает браузеру возможное место разрыва длинной строки.

  Не рекомендуется: Рекомендуется: Специальные символы

  Но как быть, если в значении атрибута нужно использовать двойную кавычку? Или в тексте документа — треугольную скобку? Ведь тогда непонятно, какая из кавычек закрывает атрибут, а какая относится к его значению, и является ли скобка началом тега или это математический знак «меньше»? В этом, а также во многих других случаях на помощь приходят специальные символы HTML.

  Специальные символы в HTML реализуются с помощью интерпретируемых браузером мнемокодов. Например, двойную кавычку (") можно вывести кодом " , а знак евро (€) — € . Все мнемокоды начинаются с амперсанда (&) и заканчиваются точкой с запятой (;). Чтобы обычный амперсанд в тексте не путался с началом мнемокода, его всегда необходимо выводить кодом & . С помощью мнемокодов можно отображать даже символы UTF-8. Такие мнемокоды имеют вид xxx; , где вместо xxxx указывается десятичный код символа в кодировке UTF-8. Например, © отобразится как «©». Многие из символов UTF-8 имеют аналоги в виде текстовых мнемокодов. Тот же символ « » можно обозначить вот так: .

  9 комментариев Я где то читал что атрибут target="_blank" как бы не очень хорошо использовать, не нарушает ли он каких нибудь стандартов? Я читал, что разработчику нельзя решать за пользователя как ему открывать ссылку (в новой вкладке или в той же), как бы это не хорошо. Хотелось бы узнать ваше мнение. Атрибут target="_blank" не включен в стандарт XHTML. Для сохранения валидности XHTML-страниц, значение target подменяют (при необходимости, конечно) с помощью JavaScript. В HTML это вполне валидный атрибут и в таких трюках нет необходимости.

  По поводу целесообразности соглашусь с тем, что злоупотреблять им не стоит, поскольку большинству пользователей известен способ открыть любую ссылку в новой вкладке, да и кнопка "Назад" всегда под рукой. И все же, без target="_blank" есть некоторая вероятность потерять пользователя, "забывшего" вернуться, тогда как с ним есть вероятность навлечь праведный гнев того же пользователя. Получается палка о двух концах.

  В своей практике, как правило, использую этот атрибут только для ссылок, добавленных пользователями (в комментариях, например), т.е. переход по которым не был запланирован при подготовке статьи. А также в ситуациях, когда это действительно необходимо: например на страницах, где в момент клика пользователь может загружать видео, слушает радио, общается в чате и т.д.

  Кажись, именно в HTML 5 можно оставлять парные теги открытыми, если за ними идет другой тег. Типа, в списках тег li теперь можно не закрывать. Катерина, можно, да. И в HTML 4 тоже. В таком случае браузеры должны закрывать их самостоятельно. Однако в некоторых случаях они (IE9, например) делают это неправильно, что приводит к ошибкам в верстке, которые не так просто обнаружить. Парсеры XML (если есть необходимость их использовать) скорее всего тоже споткнутся об эти грабли. А плюсов от такой экономии кода, в общем-то, нет. На мой взгляд, теги все-таки лучше закрывать. Те, кто верстает на HTML 5, не сильно заботятся про IE. Он не поддерживает очень много возможностей HTML5 -- Википедия Сравнение браузеров (HTML5). А на htmlbook.ru есть перечень тегов, которые позволено пропускать -- http://htmlbook.ru/samhtml5/sintaksis-html5

  Пользователей IE достаточно много, чтобы просто оставить их за бортом. Graceful degradation — наше всё. Касаемо незакрытых парных тегов вы правы — если строго следовать этому перечню, проблем даже в IE быть не должно, эти правила действуют со времен HTML 3.2.

  Спасибо, ознакомлюсь) Спасибо за откровение! Отличный материал, однозначно стоит использовать.

  Доброго времени суток, друзья! Сегодня у нас очередная статья, посвященная одной из категорий моего сайта «HTML-путеводитель для новичков ». Наверное, нужно было начинать заполнять эту категорию с написания статьи, что такое HTML или же с этого поста, в котором будет подробно изъяснено, что такое теги html. Но так уж сложилось, что в ней я уже опубликовал несколько полезных материалов, к примеру, о том, как сделать линию средствами HTML или же, как сделать рамку . Ну да ладно, надеюсь, моя оплошность не вынудила вас искать информацию среди других источников.

  Для того чтобы разобраться с тегами давайте для начала вспомним что такое HTML? И так HTML – это англоязычная аббревиатура, расшифровывающаяся как - язык разметки гипертекста . Это стандартный язык, интерпретирующийся всеми современными браузерами, отвечающий за структуру и содержание страницы. Именно с помощью HTML можно указать, как будет выглядеть текст, рисунок или анимация, отображающаяся на интернет странице, а также задать ей местоположение, размер и т.п. Представленный язык разметки включает в себя теги html, являющиеся его основой.

  Теги – определенная именованная метка состоящая из символов латинского алфавита, заключенная в угловые скобки (к примеру ). Тег – основной элемент HTML документа. Их заполнение должно осуществляться в нижнем регистре, то есть вместо < TITLE > должно быть < title > .

  Виды тегов html

  Существует два типа тегов – одиночные и парные (контейнеры). Последние являются более распространенными. Все что включено между открывающимся и закрывающимся тегом называют содержимым контейнера. Как можно заметить внутри закрывающегося тега обязательно нужно ставить слеш, т.е. косую черту «/», находящуюся сразу же после первой угловой скобки. Действие тегов распространяется на заключенную между ними информацию.

  Одиночные теги (метки ) как можно догадаться состоят из одного html элемента – открывающегося тега (например ).

  В независимости от вида каждый тег состоит из следующих элементов:

  Открывающаяся угловая скобка (< ).

  Имя тега (p , body , br ).

  Закрывающаяся угловая скобка (> ).

  Для расширения возможностей используемого тега используются различные атрибуты и значения атрибутов, разделяющиеся между собой с помощью пробела. В свою очередь атрибуты можно условно разделить на обязательные и необязательные.

  Основные теги html

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

  Основные парные теги html

  - < html > - сообщает браузеру о том, что перед ним находится HTML документ.

  - < head > - содержит описание интернет-страницы и является некой емкостью для всех заголовочных элементов html-документа, цель которых - помогать браузерам и поисковым системам в работе с данными.

  - < body > - определяет видимую часть документа.

  - - отвечает за отображение и название документа.

  - < table >, < tbody >, < thead >, < td >, < th > и < tr > - теги, относящиеся к созданию таблиц.

  -

  - закрытие данного тега сообщает браузерам о том, что текст отображается с новой строки, то есть с нового абзаца.

  - - задает заголовок (h1 …h6 ).

  -
  - тег устанавливающий перевод строки в том месте, где он находится.

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

  - ,

  , - теги отвечающее за .

  - , - эффект для текста имитирующий стиль печатной машинки.

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

  - - тег, используемый для создания бегущей строки.

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

  - - весьма распространенный тег, отвечающий за создание гиперссылки.

  - - цитирование.

  - - выводит в HTML документе примеры кода.

  - - отвечает за отображение текста заключенного в скобки.

  - - создает отступы с обеих сторон текста.

  Основные одиночные теги

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

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

  - - указывает на таблицу стилей CSS. Данный тег задается в теге < head > . HTML документ может состоять из энного количества тегов , задающих странице стилистику в независимости от расположения ее содержимого.

  - < hr > - добавляет горизонтальную линию.

  Нажав сочетание клавиш Ctrl + U можно заметить, что весь HTML-документ построен на использовании HTML тегов и атрибутов. Совсем не обязательно запоминать все существующие HTML теги. Для внесения корректировок на сайт достаточно запомнить те, что приведены выше.

  Надеюсь, статья оказалась для вас полезной, и теперь вы знаете, какие существуют виды тегов и что это вообще такое.

  Спасибо за внимание и до скорого на страницах Stimylrosta.

  Обнаружили в тексте грамматическую ошибку? Пожалуйста, сообщите об этом администратору: выделите текст и нажмите сочетание горячих клавиш Ctrl+Enter

  Министерство образования Республики Беларусь

  БЕЛОРУССКИЙ НАЦИОНАЛЬНЫЙ ТЕХНИЧЕСКИЙ УНИВЕРСИТЕТ

  Кафедра «Основы бизнеса»

  Отчёт о выполнении лабораторной работы №1

  «СТРУКТУРА ГИПЕРТЕКСТОВОГО ДОКУМЕНТА»

  по дисциплине «Информационные технологии»

  Выполнила: студентка гр.105032Бычко Е.В.

  Принял:преподавательДашкевичН.В.

  Лабораторная работа №1

  СТРУКТУРА ГИПЕРТЕКСТОВОГО ДОКУМЕНТА

  Цель работы: приобрести начальные навыки создания простейших Internet-документов; научиться выполнять форматирование созданных Web-страниц.

  Выполнение работы

  Задание 1.Создание файловой структуры

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

  Рис. 1.1. Файловая структура

  Задание 2. Создание HTML документа

  Средствами приложения блокнот создайте HTMLдокумент, при просмотре которого в браузерах в строке заголовка окна отображается текст «Содержимое строки заголовка», в основной области – текст «Так выглядит документ HTML». На рисунке 2.1. представлен HTML документ.

  

  Рис. 2.1. HTMLдокумент

  Просмотр документа в браузере представлен на рисунке 2.2.

  

  Рис. 2.2. Документ в браузере

  Задание 3. Изменение HTMLдокумента

  Необходимо изменить документ таки образом, чтобы при просмотре в браузере в строке заголовка отображался текст «Общий вид документа html», а в основной части документа – текст:

  «Вот некоторые приемы работы,

  которые мы освоим:

  разбиение текста

  выравнивание текста

  создание заголовков

  работа с таблицами.»

  Структура HTML документа представлена на рисунке 3.1.

  

  Рис. 3.1. HTMLдокумент

  Просмотр документа в браузере (рис. 3.2).

  

  Рис. 3.2. Документ в браузере

  Контрольные вопросы

  Что такое гипертекст?

  Какова структура простейшего HTML-документа?

  Структура самого простого HTML документа имеет следующий вид:

  ЗАГОЛОВОКДОКУМЕНТА

  ПЕРВЫЙ ТЕКСТ НА СТРАНИЧКЕ

  Как задаётся начало текстового абзаца?

  Для задания начального абзаца необходимо использовать парный тег - начало и конец абзаца.

  В чём заключается разметка гипертекста средствами HTML?

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

  Чем непарные теги отличаются от парных?

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