HTML :: Универсальные атрибуты
http://belarusweb.net
Основы создания сайтов

HTML :: Универсальные атрибуты

В HTML 5 атрибуты, которые применимы практически ко всем тегам, называют универсальными атрибутами. На данный момент стандарт выделяет 13 универсальных атрибутов:

  • accesskey – позволяет получить доступ к элементу при помощи специальной комбинации клавиш, которая зависит от используемого браузера.
  • class – используется для указания имени класса стилевого оформления, который будет применяться к элементу, сформированному данным тегом.
  • contenteditable – разрешает редактирование текста прямо в браузере.
  • dir – задает направление и отображение текста.
  • draggable – разрешает перетаскивание элемента используя Drag and Drop API.
  • hidden – скрывает содержимое элемента от просмотра.
  • id – задает уникальное имя элемента, по которому к нему могут обращаться скрипты или задаваться именной (т.е. использующийся только для этого элемента) класс CSS.
  • lang – указывает браузеру, на каком языке написан текст внутри данного элемента.
  • spellcheck – указывает браузеру о необходимости проверки орфографии в тексте.
  • style – предназначен для определения стиля элемента при помощи правил CSS.
  • tabindex – определяет последовательность получения фокуса при переходе между элементами с помощью клавиши 'Tab'.
  • title – создает всплывающую подсказку к элементу, которая появляется при наведении курсора на элемент.
  • translate – сообщает браузеру о том, что содержимое данного элемента переводить не нужно.

Примеры

HTML Результат BwCodes
<!DOCTYPE html>

<html>
<head>
	<meta charset="utf-8">	
	<!-- Это элемент 'title', а не атрибут -->
	<title>Используем универсальные атрибуты</title>
	</head>
<body>
	<p contenteditable="true" tabindex="5" spellcheck="false">
		Я &ndash; абзац, который можно редактировать.<br>
		Проверка орфографии отключена.
	</p>
	
	<textarea tabindex="0" accesskey="s">
         Я &ndash; текстовое поле. Чтобы передать мне фокус,<br>
		нажмите спецкомбинацию клавиш текущего браузера + клавишу 's'.
    </textarea>
	
	<p tabindex="1" title="Мой tabindex равен единице!">
		<span hidden>А я показан не буду.</span>
		Наведите на меня курсор и подождите)))<br>
		Кстати, при нажатии <span style="color: green">'Tab'</span>
		я первым <br>получаю фокус, т.к. у меня наименьшее значение<br>
		<span style="color: red">tabindex</span> из тех, что больше нуля.
	</p>
</body>
</html>	

Пример №1