Title html атрибут: Атрибут title | htmlbook.ru

Leave a Comment / Html / By /

Атрибут title | HTML | WebReference

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

Синтаксис

title="<текст>"

Значения

Произвольная текстовая строка.

Значение по умолчанию

Нет.

Пример

<!DOCTYPE html> <html> <head> <meta charset=»utf-8″> <title>Атрибут title</title> </head> <body> <p title=»А вот и я!»>Пример всплывающей подсказки</p> </body> </html>

Результат данного примера показан на рис. 1.

Рис. 1. Вид всплывающей подсказки

Спецификация

СпецификацияСтатус
WHATWG HTML Living StandardЖивой стандарт
HTML5. 1Рабочий проект
HTML5Рекомендация
HTML 4.01 SpecificationРекомендация
Спецификация

Каждая спецификация проходит несколько стадий одобрения.

  • Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
  • Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
  • Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
  • Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
  • Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
  • Draft (Черновик спецификации) — первая черновая версия стандарта.

Браузеры

41214 11
1161
Браузеры

В таблице браузеров применяются следующие обозначения.

  • — элемент полностью поддерживается браузером;
  • — элемент браузером не воспринимается и игнорируется;
  • — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

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

См. также

  • Всплывающая подсказка

Рецепты

  • Как добавить всплывающую подсказку к тексту?

Элементы HTML

Атрибуты

Значения

Типы элементов

Аудио и видео

Документ

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Формы

Фреймы

seodon.

ru | Общие атрибуты HTML
  • Общие атрибуты
  • accesskey
  • class
  • dir
  • id
  • lang
  • style
  • tabindex
  • title

Опубликовано: 25.06.2010 Последняя правка: 08.12.2015

Атрибут title используется для вывода «всплывающей» подсказки при наведении курсора мыши на HTML-элемент, что позволяет пользователю получить дополнительную информацию при просмотре веб-страницы. Например, title часто указывают для ссылок (тег <A>) или изображений (тег <IMG>).

Атрибут title появился в HTML довольно давно, но раньше он поддерживался ограниченным количеством тегов, а теперь он есть у всех. Поэтому, если на страницах описания каких-то тегов вы увидите логотип HTML 5 () напротив атрибута, то знайте, что этот тег начал поддерживать данный атрибут именно с версии HTML 5. C другой стороны, хоть в HTML 5 теперь все теги могут иметь этот атрибут — не факт, что браузеры его будут также понимать во всех случаях. Более того, в описаниях W3C также нет конкретики по данному вопросу, например о том, для чего использовать атрибут title в теге <META> или <TITLE>.

Значения

Значением атрибута title является любая строка текста, заключенная в двойные (» «) или одинарные (‘ ‘) кавычки. Причем, если используются двойные кавычки, то внутри текста можно использовать только одинарные и наоборот.

Значение по умолчанию: нет.

Синтаксис

<body title="текст">...</body>
<img src="URL" alt="текст" title="текст">
<a href="URL" title="текст">...</a>

Обязательный атрибут: нет.

Пример HTML: применение атрибута title

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>seodon.ru - атрибут title</title>
 </head>
 <body>
  <p><a href="https://seodon. ru/" title="Переход на 'Главную' страницу">Главная</a></p>
  <address title="Автора не бить - пишет, как умеет!">
  Автором данного опуса является Бездарных Б.Б.<br>
  Все свои положительные эмоции по поводу его<br>
  творения вы можете высказать ему лично по<br>
  тел. +1 111-222-33-44.</address>
 </body>
</html>

Результат примера

Результат: Применение атрибута title.

Поддержка версиями HTML

Версия:HTML 4.01HTML 5XHTML 1.0XHTML 1.1
Поддержка:ДаДаДаДа

Поддержка браузерами

Браузер:Internet ExplorerGoogle ChromeMozilla FirefoxOperaSafari
Версия:6.0 и выше2.0 и выше2.0 и выше9.2 и выше3.1 и выше
Поддержка:ДаДаДаДаДа

html — документирование разделов div, использовать атрибут title?

спросил

Изменено 2 года назад

Просмотрено 54к раз

Я ищу самый краткий способ документирования разделов моей страницы, например. разделы div.

Что-то не так с использованием атрибута title, т.е.

 

   ...

?

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

  • HTML
  • XHTML

3

Если элемент имеет атрибут title , большинство браузеров показывают всплывающую подсказку со значением атрибута при наведении на него курсора. В этом случае они будут показывать всплывающую подсказку «Область оплаты» при наведении курсора на в любом месте над этим div .

У HTML-атрибутов, как правило, есть цель. В HTML есть комментарии для документации! Попробуйте их:

 
 
    ...

Вы упомянули, что не хотите лишних комментариев. Если вы подсчитаете символы (включая необходимый пробел перед атрибутом), они на самом деле будут одинаковой длины:

 title="Платежная зона"

(Но, согласен, они выглядят больше!)

5

Я бы, вероятно, использовал id s, таким образом вы также можете использовать их в качестве хуков для вашего CSS и JavaScript.

В противном случае ответ Гейба служит хорошим аргументом в пользу атрибутов данных . Джон Резиг объясняет, почему они хороши здесь: http://ejohn.org/blog/html-5-data-attributes/

9

Я бы рекомендовал использовать стандарт настраиваемых атрибутов HTML5:

По сути, перед именем следует указать data- , и браузер его проигнорирует.

4

Атрибут title не предназначен для div — я не проверял официальные спецификации, но не думаю, что это даже поддерживаемый атрибут.

Лучше всего использовать атрибут «id». Это имеет дополнительное преимущество, заключающееся в предоставлении крючков для вашего CSS.

Вы также можете пойти дальше и использовать html5, который предоставляет вам более описательные элементы, такие как

Используя следующий css, вы получите ту же ситуацию, что и с заголовком:

 .hover-container {
    положение: родственник;
}
.hover-контент {
    положение: абсолютное;
    внизу: -10px;
    справа: 10 пикселей;
    дисплей: нет;
}
.hover-контейнер: hover . hover-контент {
    дисплей: блок;
}

Это дает вам возможность стилизовать его в соответствии с вашими потребностями, и он работает во всех браузерах. Даже те, где отключен javascript.

Плюсы:

  • Вы оказываете большое влияние на стиль
  • Работает (почти) во всех браузерах

Минусы:

  • Труднее позиционировать всплывающую подсказку

3

Не уверен, что это работает со всеми браузерами или сторонними инструментами, но мне удалось просто указать «\n» во всплывающих подсказках для новой строки, работает с dhtmlx по крайней мере в ie11, firefox и chrome

 для (ключ var в oPendingData ) {
    var obj = oPendingData[ключ];
    this.cells(sRowID, nColInd).cell.title += "\n" + obj["ChangeUser"] + ": " + obj[sCol];
}

1

Во всплывающей подсказке начальной загрузки просто используйте data-html=»true»

3

Нет, это невозможно, браузеры по-своему реализуют всплывающую подсказку.