Не буду упоминать о необходимости и применяемости спойлеров в оформлении контента с помощью "скрывающихся или развертывающих спойлеров", скажу одно, они нужны и реализовать их можно по-разному. Можно применить Java Script, можно применить CSS, но оказывается и открывающийся спойлер можно реализовать и посредством чистого HTML.
Нет, мы конечно понимаем, что чистый HTML здесь подразумевает применение и скриптов языков, которые как раз работают с разметкой и заставляют те или иные теги в этой разметки менять свой стиль, отображение, активность. Собственно это уже дело этих самых языков, нас интересует результат и по факту наших вложений. А тут все же получается, что даже написав пару строк на чистом HTML мы получаем полноценный спойлер.
Итак, прежде всего о самом коде, о разметке тегами того по чему надо кликать и где прописывать срыты текст.
Смотреть код
То есть делаем так, details обрамляет весь наш контент и его не видно, за исключением того, что в теге summary. Смотрим пример.
click me
hide text!Что интересно, мы даже можем избавиться от summary, просто убрав его. Тогда автоматом будет подписываться слово "Сведения" и наш спойлер будет работать уже при нажатии на это слово. Вот этот пример далее