Атрибут HTML

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

Было распознано несколько основных типов атрибутов, включая: (1) обязательные атрибуты , необходимые конкретному типу элемента для правильного функционирования этого типа элемента; (2) необязательные атрибуты , используемые для изменения функциональности по умолчанию для типа элемента; (3) стандартные атрибуты , поддерживаемые многими типами элементов; и (4) атрибуты событий , используемые для того, чтобы типы элементов определяли сценарии, запускаемые при определенных обстоятельствах.

Некоторые типы атрибутов работают по-разному, когда используются для изменения разных типов элементов. Например, имя атрибута используется несколькими типами элементов, но каждый из них выполняет несколько разные функции. ^[1]

Описание

Атрибуты HTML обычно отображаются в виде пар имя-значение , разделенных знаком =, и записываются внутри начального тега элемента после имени элемента:

< element  attribute = "value" > содержимое элемента </ element >

Где elementименует тип элемента HTML, а attribute- имя атрибута, установленного в предоставленное значение value. Значение может быть заключено в одинарные или двойные кавычки, хотя значения, состоящие из определенных символов, можно не заключать в кавычки в HTML (но не в XHTML). ^{[2] [3]} Оставление значений атрибутов без кавычек считается небезопасным. ^[4]

Хотя большинство атрибутов предоставляется в виде парных имен и значений, некоторые влияют на элемент просто своим присутствием в начальном теге элемента ^[5] (например, ismapатрибут для imgэлемента ^[6] ).

Элемент сокращения,, abbrможет использоваться для демонстрации этих различных атрибутов:

< abbr  id = "anId"  class = "aClass"  style = "color: blue;"  title = "Язык гипертекстовой разметки" > HTML </ abbr >

Этот пример отображается как HTML синим цветом без ссылки, и в большинстве браузеров при наведении курсора на аббревиатуру должен отображаться текст заголовка «Язык гипертекстовой разметки» на плавающем желтом фоне ( всплывающая подсказка ).

< div  style = "textalign: center;" > Текст по центру </ div >

В этом другом примере ваш текст будет выглядеть так:

Большинство элементов также принимают связанные с языком атрибуты langи dir.

Общие атрибуты

Обычно элементы HTML могут принимать любой из нескольких наиболее распространенных стандартных атрибутов ( см. Полный список ):

• idАтрибут предоставляет документ шириной уникального идентификатора для элемента. ^{[7] [8] [9]} Его можно использовать в качестве селектора CSS для предоставления презентационных свойств, браузерами для акцентирования внимания на конкретном элементе или скриптами для изменения содержимого или представления элемента. Добавленный к URL-адресу страницы, URL-адрес напрямую нацелен на конкретный элемент в документе, обычно это подраздел страницы. Например, идентификатор «Атрибуты» в http://en.wikipedia.org/wiki/HTML#Attributes(см. Раздел «Атрибуты» на странице «HTML»).
• classАтрибут обеспечивает способ классификации подобных элементов. ^{[10] [11]} Это может использоваться для семантических целей или для целей презентации. Семантически, например, классы используются в микроформатах . В презентационном плане, например, документ HTML может использовать обозначение, class="notation"чтобы указать, что все элементы с этим значением класса подчинены основному тексту документа. Такие элементы могут быть собраны вместе и представлены в виде сносок на странице вместо того, чтобы появляться в том месте, где они встречаются в исходном HTML. Другое использование презентации было бы как селектор CSS . Можно добавить несколько классов , поставив пробелы между каждым идентификатором .
• Автор может использовать styleсвойства представления неатрибутивных кодов для конкретного элемента. styleАтрибут может использоваться в любом элементе HTML (он будет проверяться на любом элементе HTML; однако это не обязательно полезно). Считается лучшей практикой использовать атрибуты элемента idили classдля выбора элемента с помощью таблицы стилей , хотя иногда это может быть слишком громоздким для простого и специфического или специального применения стилизованных свойств.
• titleАтрибут используется для прикрепления subtextual объяснения к элементу. В большинстве браузеров этот атрибут отображается как всплывающая подсказка .

Разновидности

Атрибуты HTML обычно классифицируются как обязательные атрибуты , необязательные атрибуты , стандартные атрибуты и атрибуты событий :

• Обычно обязательные и необязательные атрибуты изменяют определенные элементы HTML.
• Хотя стандартные атрибуты можно применить к большинству HTML-элементов. ^[12]
• Атрибуты событий, добавленные в HTML версии 4, позволяют элементу указывать сценарии, запускаемые при определенных обстоятельствах. ^[13]

Обязательный и необязательный

Используется одним элементом

• <applet> : код , объект
• <area> : nohref
• <body> : ссылка , фон , ссылка , текст , vlink
• <form> : accept-charset , действие , enctype , метод
• <frame> : размер без рамки
• <head> : профиль
• <hr> : noshade
• <html> : xmlns
• <img> : ismap
• <input> : проверено , максимальная длина
• <label> : для
• <meta> : контент , http-экв , схема
• <объект> : classid , codetag , data , declare , standby
• <ol> : начало
• <опция> : выбрано
• <параметр> : тип значения
• <сценарий> : отложить , xml: пробел
• <select> : несколько
• <таблица> : заполнение ячеек , расстояние между ячейками , рамка , правила , сводка
• <td> : заголовки

Используется двумя элементами

• <a> и <area> :
  • coords - координаты <area> или <link> внутри него.
  • shape - форма <area> или <link> внутри него. Значения: по умолчанию, прямоугольник, круг, поли.
• <a> и <ссылка> :
  • hreflang - Код языка связанного документа. ( <a> , <ссылка> )
  • rel - характер связанного документа (относительно текущей отображаемой страницы). Свободный текст для <a> , но <link> использует набор терминов (альтернатива, приложение, закладка, глава, содержание, авторское право, глоссарий, справка, главная, указатель, следующий, предыдущий, раздел, начало, таблица стилей, подраздел).
  • rev - Тип текущей отображаемой страницы (относительно связанного документа). Различается для <a> и <link>, как для rel.
• <апплет> и <объект> :
  • archive - URL-адреса архива ( <приложение> , <объект> )
  • codebase - базовый URL ( <applet> , <object> )
• <basefont> и <font> :
  • color - цвет текста (не рекомендуется) ( <basefont> , <font> )
  • face - семейство шрифтов (не рекомендуется) ( <basefont> , <font> )
• <col> и <colgroup> :
  • span - количество охваченных столбцов ( <col> , <colgroup> )
• <del> и <ins> :
  • datetime - дата и время удаления или вставки текста .
• <form> и <input> :
  • accept - типы файлов, принимаемых при загрузке <form> или <input>
• <frame> и <iframe> :
  • frameborder - значение (0 или 1) указывает, отображать ли рамку вокруг <frame> или <iframe> .
  • marginheight - верхнее и нижнее поля в пикселях вокруг <frame> или <iframe> .
  • scrolling - value (yes, no, auto) указывает, отображать ли полосы прокрутки вокруг <frame> или <iframe> .
  • marginwidth - левое и правое поля в пикселях вокруг <frame> или <iframe> .
• <frameset> и <textarea> :
  • cols - количество видимых столбцов в <frameset> или <textarea> (некоторые варианты)
  • rows - количество видимых строк в <frameset> или <textarea> (некоторые варианты)
• <img> и <объект> :
  • usemap - указывает имя элемента карты для использования с <img> -или- URL карты изображения для использования с <object> .
• <input> и <textarea> :
  • readonly - указывает текст только для чтения для <input> и <textarea> .
• <ссылка> и <стиль> :
  • media - указывает устройство отображения для <link> и <style> . Значения: все, слух, шрифт Брайля, портативный, печать, проекция, экран, tty, TV.
• <optgroup> и <option> :
  • label - текст описания для <optgroup> или <option> .
• <td> и <th> :
  • abbr - сокращенная версия ячейки или заголовка таблицы .
  • ось - название категории для ячейки или заголовка таблицы .
  • colspan - количество столбцов, охватываемых ячейкой или заголовком таблицы .
  • nowrap - (не рекомендуется) предотвращает перенос ячейки или заголовка таблицы .
  • rowspan - количество строк, занимаемых ячейкой или заголовком таблицы .
  • scope - не влияет на нормальное отображение в браузере, но отмечает ячейку или заголовок таблицы как логический заголовок для других ячеек. Значения: col, colgroup, row, rowgroup.

Используется несколькими элементами

• выровнять - <applet> , <col> , <colgroup> , <object> , <tbody> , <td> , <tfoot> , <th> , <thead>

• align также устарело в <caption> , <div> , <h1> to <h6> , <hr> , <iframe> , <img> , <input> , <legend> , <p> , <table>

• alt - <applet> , <area> , <img> , <input>
• bgcolor - <тело> , <таблица> , <td> , <th> , <bgcolor>
• граница - <img> , <объект> , <таблица>
• char - <char> , <colgroup> , <tbody> , <td> , <tfoot> , <th> , <thead> , <tr>
• charoff - <col> , <colgroup> , <tbody> , <td> , <tfoot> , <th> , <thead> , <tr>
• кодировка - <a> , <ссылка> , <скрипт>
• cite - <blockquote> , <del> , <ins> , <q>
• компактный - <dir> , <menu> , <ol> , <ul>
• отключено - <button> , <input> , <optgroup> , <option> , <select> , <textarea>
• высота - <applet> , <iframe> , <img> , <object> . Также не рекомендуется в <td> , <th>
• href - <a> , <area> , <base> , <link>
• hspace - <приложение> , <объект> . Также не рекомендуется в <img>
• longdesc - <кадр> , <кадр > , <img>
• имя - <a> , <applet> , <button> , <form> , <frame> , <iframe> , <input> , <map> , <meta> , <object> , <param> , <select> , <textarea>
• размер - <basefont> , <font> , <hr> , <input> , <select>
• ЦСИ - <кадр> , <IFRAME> , <IMG> , <вход> , <скрипт>
• цель - <a> , <area> , <base> , <form> , <link>
• тип - <button> , <input> , <li> , <link> , <object> , <ol> , <param> , <script> , <style> , <ul>
• valign - <col> , <colgroup> , <tbody> , <td> , <tfoot> , <th> , <thead> , <tr>
• значение - <button> , <input> , <li> , <option> , <param>
• vspace - <приложение> , <img> , <объект>
• ширина - <applet> , <col> , <colgroup> , <hr> , <iframe> , <img> , <object> , <pre> , <table> , <td> , <th>

Стандартные атрибуты

Стандартные атрибуты также известны как глобальные атрибуты и работают с большим количеством элементов. ^[14] Они включают в себя основные стандартные атрибуты: к ним относятся ключ доступа, класс, contenteditable, contextmenu, data, dir, hidden, id, lang, style, tabindex, title . Есть и экспериментальные. Оба xml: lang и xml: base устарели. Множественные aria- * атрибуты улучшения доступности. ^[14] Атрибуты обработчика событий перечислены ниже.

Технически все стандартные атрибуты должны приниматься всеми элементами, хотя они не будут работать с некоторыми элементами. ^[15] В таблице ниже перечислены некоторые общие стандартные атрибуты и некоторые элементы, с которыми они могут работать.

Атрибуты события

Стандартные атрибуты включают атрибуты обработчика событий . Все они имеют префикс -: ^[14]

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

См. Также

• HTML-элемент

Ссылки