От автора: как вы, наверное, знаете, существует несколько атрибутов HTML, которые считаются глобальными, поскольку они могут применяться к любому элементу HTML. В качестве примеров можно привести class, id, style и tabindex. Атрибут hidden HTML5, который был добавлен несколько лет назад, и о котором вы, возможно, забыли, используется для двух элементах в следующем коде.
|
1 2 |
<p hidden>Example text. Nothing to see here.</p> <textarea hidden>More example text.</textarea> |
Атрибут hidden — это логическое значение, которое, если задано для элемента: «указывает, что элемент еще не указан или больше не имеет прямого отношения к текущему состоянию страницы, или что он используется для объявления содержимого для повторного использования другими частями страницы, а не для прямого доступа пользователя».
Ниже приведена демоверсия, в которой используется этот атрибут. Нажмите на кнопку, чтобы переключиться с атрибута hidden для соответствующих элементов. Обратите внимание, что для использования этого атрибута не нужен JavaScript; я просто применил некоторые скрипты для включения и выключения, чтобы продемонстрировать эту функцию.
string(4) "TEST" array(1) { [0]=> object(WP_Term)#12211 (16) { ["term_id"]=> int(340) ["name"]=> string(5) "HTML5" ["slug"]=> string(5) "html5" ["term_group"]=> int(0) ["term_taxonomy_id"]=> int(2194) ["taxonomy"]=> string(8) "category" ["description"]=> string(65) "Статьи, уроки, обучение по языку html 5" ["parent"]=> int(2185) ["count"]=> int(104) ["filter"]=> string(3) "raw" ["cat_ID"]=> int(340) ["category_count"]=> int(104) ["category_description"]=> string(65) "Статьи, уроки, обучение по языку html 5" ["cat_name"]=> string(5) "HTML5" ["category_nicename"]=> string(5) "html5" ["category_parent"]=> int(2185) } }
Практический курс по верстке адаптивного сайта с нуля!
Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3
Узнать подробнееЭлемент textarea по-прежнему скрыт, потому что селектор типа элемента недостаточно специфичен, чтобы переопределить CSS браузера. Однако элемент абзаца отображается, потому что я использую селектор классов, который переопределяет селектор атрибутов браузера.
Атрибут hidden поддерживается во всех современных браузерах и даже в IE11, поэтому его можно использовать в большинстве проектов.
Автор: Louis Lazaris
Источник: //www.impressivewebs.com/
Редакция: Команда webformyself.
Практический курс по верстке адаптивного сайта с нуля!
Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3
Узнать подробнее
Notice: Undefined offset: 29 in /home/httpd/vhosts/webformyself.com/httpdocs/wp-content/themes/web4my/single.php on line 702
