Малоизвестные атрибуты HTML-элементов - Smart-Frontend

Малоизвестные атрибуты HTML-элементов

Малоизвестные атрибуты HTML-элементов


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

Contenteditable

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

<p contenteditable="true">Образец текста</p>

Hidden

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

<p hidden>Этот текст скрыт</p>

Multiple

Позволяет пользователю вводить более одного значения. Этот атрибут HTML-элемента применяется для input и select.

// Позволяет загружать несколько файлов
<input type="file" multiple> 

// Позволяет выбирать несколько элементов option 
<select multiple>      
    <option value="#">Item 1</option>      
    <option value="#">Item 2</option>      
    <option value="#">Item 3</option>
</select>

Poster

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

<video controls poster="image.jpg"></video>

Spellcheck

Атрибут HTML-элемента spellcheck определяет необходимость проверки орфографии и грамматики в содержимом элемента.

// Не стоит использовать его для поля ввода пароля
<input type="text" spellcheck="true">

Accept

Этот атрибут определяет формат доступных для загрузки файлов.

// Позволяет загружать только файлы в pdf формате 
<input type="file" accept="application/pdf"> 

// Позволяет загружать только изображения 
<input type="file" accept="image/*"> 

// Позволяет загружать только изображения jpeg/jpg формата 
<input type="file" accept="image/jpeg"> 

// Позволяет загружать только изображения png формата 
<input type="file" accept="image/png">

Редкие атрибуты HTML-элементов и их применение

Эти атрибуты HTML-элементов встречаются очень редко, а многие из начинающих верстальщиков, возможно, вообще о них ни разу не слышали. Тем не менее, они существуют и могут использоваться при необходимости.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *