/html/global-attributes/hidden:> Скрытие содержимого_
Глобальный атрибут hidden
Синтаксис
HTML
<[элемент] hidden="hidden"> ... </[элемент]>
Описание
Глобальный атрибут / параметр hidden
(от англ. "hidden" ‒ «скрытый») скрывает содержимое элемента. Элемент с атрибутом «hidden
» скрывается от всех устройств вывода (монитор, принтер).
Примечание
CSS свойство «display: block
» отменяет действие данного параметра.
Условия использования
- Необходимо следить за тем, чтобы в документе не было гиперссылок, а так же вспомогательных элементов (
label
,output
) которые, не имея данного атрибута указывают на элементы скрытые при помощи этого атрибута. - Допускается использование скриптов для работы со скрытыми элементами, так как элементы, находящиеся в скрытом разделе по-прежнему активны. Скрипты и элементы управления формой в таких разделах, по-прежнему выполняться, и возвращают соответствующие результаты.
Поддержка браузерами
Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.
IExplorer
Safari
Поддерж.
iOS
Android
Спецификация
Верс. | Раздел | |
---|---|---|
HTML | ||
2.0 | ||
3.2 | ||
4.01 | ||
5.0 | 7.1 The hidden attribute | Перевод |
5.1 | 5.1. The hidden attribute | |
XHTML | ||
1.0 | ||
1.1 |
Значения
Данный атрибут является логическим атрибутом. Может указываться либо без значения, либо с пустым значением, либо со значением «autofocus
».
<textarea hidden> ... </textarea> <textarea hidden=""> ... </textarea> <textarea hidden="hidden"> ... </textarea>
Пример использования
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Глобальный параметр hidden</title>
<script type="text/javascript" src="start.js"></script>
</head>
<body>
<h1>Пример с "hidden"</h1>
<section id="login">
<h2>Вход в игру</h2>
<form id="data"></form>
<p><input type="text" form="data" value="Логин"></p>
<p><input type="password" form="data" value="Пароль"></p>
<p><input type="reset" form="data"> <button onclick="start()">Начать</button></p>
</section>
<section id="game" hidden="hidden">
... Игра ...
</section>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Глобальный параметр hidden</title>
<script type="text/javascript" src="start.js"></script>
</head>
<body>
<h1>Пример с "hidden"</h1>
<section id="login">
<h2>Вход в игру</h2>
<form id="data"></form>
<p><input type="text" form="data" value="Логин"></p>
<p><input type="password" form="data" value="Пароль"></p>
<p><input type="reset" form="data"> <button onclick="start()">Начать</button></p>
</section>
<section id="game" hidden="hidden">
... Игра ...
</section>
</body>
</html>
Глобальный параметр hidden