САЙТ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ НА РУССКОМ ЯЗЫКЕ
×

HTML5 Учебник

HTML ГлавнаяHTML ВведениеHTML РедакторыHTML ОсновныеHTML ЭлементыHTML АтрибутыHTML ЗаголовкиHTML ПараграфыHTML СтилиHTML ФорматированиеHTML ЦитированиеHTML КомментарииHTML ЦветаHTML c CSSHTML СсылкиHTML ИзображенияHTML ТаблицыHTML СпискиHTML БлокиHTML КлассыHTML ИдентификаторыHTML ФреймыHTML JavaScriptHTML Путь к ФайлуHTML ГлаваHTML МакетHTML АдаптивныйHTML Компьютерный кодHTML ОбъектыHTML СимволыHTML КодировкаHTML URL КодированиеHTML XHTML

HTML Формы

HTML ФормыHTML Элементы формыHTML Тип вводаHTML Атрибуты ввода

HTML5

HTML5 ВведениеHTML5 ПоддержкаHTML5 Новые ЭлементыHTML5 СемантикаHTML5 МиграцияHTML5 Синтасис

HTML Графика

HTML CanvasHTML SVGHTML Google Карта

HTML Медиа

HTML МедиаHTML ВидеоHTML АудиоHTML ОбъектыHTML YouTube

HTML API

HTML ГеолокацияHTML ПеретаскиваниеHTML Веб ХранилищеHTML Веб РаботникHTML СОС

HTML Примеры

HTML ПримерыHTML ВикторинаHTML УпражненияHTML СертификатHTML ЗаключениеHTML Возможности

HTML Справочники

HTML Список ТеговHTML АтрибутыHTML ГлобальныеHTML СобытияHTML ЦветаHTML ХолстHTML Аудио/ВидеоHTML ДекларацииHTML Набор КодировокHTML URL КодHTML Коды языкаHTML Коды странHTTP СообщенияHTTP МетодыКовертер PX в EMКлавишные комбинации

HTML Атрибуты



Атрибуты содержат дополнительную информацию об элементах HTML.


  • Все HTML элементы могут иметь атрибуты
  • Атрибуты содержат дополнительную информацию об элементе
  • Атрибуты указываются в открывающем теге
  • Атрибутами обычно бывают парными имя/значение: name="value"

Атрибут lang

Язык документа может быть объявлен в теге <html>

Язык объявляется с помощью атрибута lang.

Объявить язык важно для специальных приложений (программ чтения с экрана) и поисковых систем:

<!DOCTYPE html>
<html lang="en-US">
<body>

...

</body>
</html>

Первые две буквы указывают язык en. Если есть диалект, использовать еще две буквы US).


Атрибут title

Атрибут title добавляется к элементу <p>. Значение атрибута title отображается в виде всплывающей подсказки при наведении указателя мыши на параграф:

Пример

<p title="Я подсказка">
При наведении мыши на параграф, отобразится атрибут title в качестве подсказки.
</p>
Редактор кода »

Атрибут href

HTML-ссылки определяются с помощью тега <a>. Адрес ссылки указан в атрибуте href:

Пример

<a href="https://schoolsw3.com">Это ссылка</a>
Редактор кода »

Вы узнаете подробнее о ссылках и тегах <a>, позже в этом учебнике.


Размер атрибута

HTML изображения, определенны с помощью тега <img>.

Имя файла источника src, размер изображения width и height - это все атрибуты:

Пример

<img src="schoolsw3.jpg" width="104" height="142">
Редактор кода »

Размер изображения указывается в пикселах: width="104" значит 104 пикселей по ширине экрана.

Вы узнаете больше о картинки и теге <img> позже в этом учебнике.


Атрибут alt

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

Значение атрибута может быть чтением с экрана. Таким образом, кто-то "видит", а слепой человек может"слышать" альтернативный текст на веб-сайте.

Пример

<img alt="SchoolsW3.com" width="104" height="142">
Редактор кода »

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

Стандарт HTML5 не требует строчные буквы в именах атрибутов.

Атрибут title может быть написан с прописными или строчными буквами, title или TITLE.

W3C в HTML рекомендует нижний регистр, а XHTML более строгие типы документов требует строчная буквы.

На SchoolsW3 мы всегда используем строчные буквы атрибутов.


Мы предлагаем: кавычки для значений атрибутов

Стандарт HTML5 не требует кавычек вокруг значений атрибутов.

Атрибуты href, могут быть написаны как:

Пример

<a href=https://schoolsw3.com>Это ссылка</a>
Редактор кода »

W3C в HTML рекомендует кавычки, а XHTML более строгие типы документов требует кавычки.

Иногда просто неободимо использовать кавычки. Этот пример не правильного отображения атрибута title, так как он содержит пробел:

Пример

<p title=О SchoolsW3 >значение содержит пробелы.</p>
Редактор кода »

Использования кавычеч являются наиболее распространенным. Не используя кавычки могут возникать ошибки.
На SchoolsW3 мы всегда использовать кавычки вокруг значений атрибутов.


Одинарные или двойные кавычки?

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

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

<p title='John "ShotGun" Nelson'>

Или наоборот:

<p title="John 'ShotGun' Nelson">

Краткое содержание

  • Все HTML элементы могут иметь атрибуты
  • Атрибут title предоставляет дополнительные информацию "подсказки"
  • Атрибут href содержит адрес ссылки
  • Атрибуты width и height предоставить информацию о размере изображений
  • атрибут alt содержит текст для чтения с экрана
  • На SchoolsW3 мы всегда использовать строчные имена атрибутов
  • На SchoolsW3 мы всегда используем для значения атрибутов двойные кавычки

HTML Упражнения

Проверте себя с помощью упражнений

Упражнение:

Добавить "всплывающую подсказку" к нижеприведенному абзацу с текстом "О SchoolsW3".

<p ="О SchoolsW3"> О SchoolsW3 сайт веб-разработчика.</p>

Начните упражнения


Атрибуты HTML

Ниже приведен алфавитный список некоторых атрибутов часто используются в HTML:

Атрибуты Описание
alt Указывает альтернативный текст для изображения, когда изображение не может быть отображено
disabled Указывает, что элемент input должен быть отключен
href Задает URL-адрес (веб-адрес) по ссылке
id Задает уникальный идентификатор для элемента
src Задает URL-адрес (веб-адрес) для изображения
style Задает встроенный стиль CSS для элемента
title Определяет дополнительную информацию об элементе (отображается как всплывающая подсказка)

Полный список всех атрибутов для каждого элемента HTML, в: Справочник HTML-атрибутов.