Основний вміст

  • <body>

Тег <summary>

Internet Explorer Chrome Opera Safari Firefox Android iOS
12.0+ 15.0+ 6.0+ 4.0+ 6.0+

Специфікація

HTML: 3.2 4.01 5.0 XHTML: 1.0 1.1

Опис

Вказує заголовок для тегу <details>, на який можна клікнути для розгортання/згортання інформації. Тег <summary> повинен йти першим всередині <details>.

Синтаксис

<details>
 <summary>Текст</summary>
</details>

Атрибути

Немає.

Закриваючий тег

Обов'язковий.

Приклад

HTML5IECrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>summary</title>
 </head> 
 <body>
  <details>
   <summary>Інформація про автора</summary>
   <p>Бендер Родрігес</p>
  </details>
 </body> 
</html>
HTML5

Часті запитання

  • Q: Як працює тег <summary> в HTML?

    A: Тег <summary> використовується для створення заголовку або підзаголовку для елемента <details> у HTML. Він відображає текст, який можна клікнути для розгортання або згортання вмісту <details>.

  • Q: Які атрибути можна використовувати з тегом <summary>?

    A: Тег <summary> не має жодних власних атрибутів, проте можна використовувати стандартні атрибути HTML, такі як id або class для стилізації.

  • Q: Чи можна вкладати тег <summary> всередину іншого тегу <summary>?

    A: Тег <summary> не можна вкладати всередину іншого тегу <summary>. Кожен елемент <details> може містити лише один елемент <summary>.

  • Q: Як можна стилізувати тег <summary> за допомогою CSS?

    A: Тег <summary> можна стилізувати за допомогою CSS, використовуючи селектори, такі як :hover для зміни стилів при наведенні курсора.

  • Q: Як коректно використовувати тег <summary> разом з тегом <details>?

    A: Для коректного використання тегу <summary> разом з тегом <details>, необхідно вкладати тег <summary> всередину тегу <details> і вказувати вміст, який відображатиметься як заголовок.