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

Выбрал несколько, наиболее приглянувшихся:

  1. 1.

    DETAILS

    Классный тег для отображения скрытого по умолчанию контента. С атрибутом open внутренности отображаются, без него — нет.

    <details>Дополнительная информация</details>

  2. 2.

    SUMMARY

    Это тег нужный, для отображения при клике по нему скрытого контента из предыдущего пункта. Без него будет использован стандартный заголовок тега (Details)

    <details><summary>Спойлер</summary>Дополнительная информация</details>

  3. 3.

    OUTPUT

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

    <input type="range" id="slider" min="0" max="101" value="11" /><output for="slider" />11</output>

  4. 4.

    TIME

    Людям хорошо понятны даты, написанные в разных форматах, однако машины все еще не так умны и для них желательно оборачивать в специальный тег полезную информацию.

    <p> Эпидемия короновируса заставила москвичей сидеть дома с <time datetime="2020-03-26">26 марта</time>, а некоторых особо удачливых еще раньше</p>

  5. 5.

    DIALOG

    Отличный тег для отображения модальных окон без заморочек.

    <dialog open>Поговорим? Хочешь меня загрузить? Или нагрузить?</dialog>

Write A Comment