1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
---
title: hidden
slug: Web/HTML/Загальні_атрибути/hidden
tags:
- HTML
- Глобальні атрибути
translation_of: Web/HTML/Global_attributes/hidden
---
<div>{{HTMLSidebar("Global_attributes")}}</div>
<p><span class="seoSummary"><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальний атрибут</a> <strong><code>Hidden</code></strong> - це булівський атрибут, який позначає,що цей елемент ще або вже не релевантний. Наприклад? цей атрибут може бути використаним, щоб сховати елементи поки не виконається вхід. Браузер не промалює елемент з заданим атрибутом</span> <code>hidden</code> .</p>
<div>{{EmbedInteractiveExample("pages/tabbed/attribute-hidden.html","tabbed-shorter")}}</div>
<p class="hidden">Початковий код для інтерактивного приклада зберігається в GitHub репозиторії. Якшо ви бажаєте зробити внесок в проект приклада, будь ласка, клонуйте <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a>і надішліть нам пул реквест.</p>
<p>Атрибут <code>hidden</code> не має використовуватись для того, щоб ховати контент, що має відображатись в іншому представленні. Наприклад, неправильно використовувати атрибут, щоб ховати панель в діалозі з вкладками, тому що інтерфейс вкладок - це вид представлення зі схованими елементами, які можна відобразити на одній великій сторінці з прокруткою. Так само не коректно використовувати вміст тільки для одного представлення - якщо щось позначено як приховане - це має бути сховане для всіх представлень включно з зчитувачами екрана.</p>
<p>Сховані елементи не мають бути прив'язані до не схованих. і до елементів, які наслідують приховані, все ще активні елементи, що означає, що скриптові елементи все ще можуть виконуватися, а елементи форми відправлятися. Проте елементи і скрипти можуть посилатися на елементи, що сховані в іншому контексті.</p>
<p>Наприклад, неправильно використовувати атрибут <code>href</code>, що посилається до секції з атрибутом <code>hidden</code>. Немає сенсу посилатися на вміст якщо він не застосовуваний і не релевантний.</p>
<p>Проте було б добре використовувати ARIA атрибут <code>aria-describedby</code> для посилання до описів, які сховані. Тоді як приховування описів означає, що вони не є корисними; Вони можуть бути написаними таким чином, щоб бути корисними в конкретному контексті посилання на них з елемента який вони описують.</p>
<p>Аналогічно елемент canvas з атрибутом <code>hidden</code> може бути використаний для заскриптованого графічного движка і форма може посилатися до схованого елемента використовуючи його атрибут форми.</p>
<div class="note">
<p><strong>Нотатка:</strong> Зміна {{cssxref("display")}} властивості елемента з атрибутом <code>hidden</code> перезаписує середовище. Для прикладу, елемент стилізований <code>display: flex</code> буде відображатись, не зважаючи на атрибут <code>hidden.</code></p>
</div>
<h2 id="Специфікація">Специфікація</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Специфікація</th>
<th scope="col">Статус</th>
<th scope="col">Коментар</th>
</tr>
<tr>
<td>{{SpecName('HTML WHATWG', "interaction.html#the-hidden-attribute", "hidden")}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td>Не змінювалося з останнього знымка, {{SpecName('HTML5.1')}}</td>
</tr>
<tr>
<td>{{SpecName('HTML WHATWG', "rendering.html#hiddenCSS", "Hidden elements")}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td>Визначає запропонований рендеринг атрибута <code>hidden</code>, використовуючи CSS</td>
</tr>
<tr>
<td>{{SpecName('HTML5.1', "editing.html#the-hidden-attribute", "hidden")}}</td>
<td>{{Spec2('HTML5.1')}}</td>
<td>Знімок {{SpecName('HTML WHATWG')}}, початкове визначення</td>
</tr>
</tbody>
</table>
<h2 id="Підтримка_браузерів">Підтримка браузерів</h2>
<div class="hidden">Таблиця підтримки на цій сторінці згенерована з структурованих даних будь ласка прогляньте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> і надішлінть нам pull request.</div>
<p>{{Compat("html.global_attributes.hidden")}}</p>
<h2 id="Дивіться_також">Дивіться також</h2>
<ul>
<li>Всіl <a href="/en-US/docs/Web/HTML/Global_attributes">глобальні атрибути</a>.</li>
</ul>
|
