TGViewer
HTML Academy HTML Academy @htmlacademy · 9.55K subscribers
Post #8679 844
Тег <details> давно делает раскрывающиеся блоки без единой строки JavaScript. Одна загвоздка оставалась: несколько блоков жили независимо — открыли один, соседние не реагируют. Эксклюзивный аккордеон, где раскрыт ровно один раздел, собирали на JS.

Теперь это закрывает атрибут name: даёте блокам общее имя — и браузер сам следит, чтобы открытым был только один. Без скриптов и библиотек.

Интереснее — что вокруг. Стандартный маркер-треугольник меняется на свой, а гладкая анимация высоты требует пары трюков. В статье — интерактивный FAQ, который можно потрогать в браузере, разбор стилизации и честные оговорки про анимацию и поддержку (Chrome 120+, Firefox 130+, Safari 17.2+). #html #css

🎈 Читать статью
  • ❤‍🔥 10
  • 🔥 4
  • ❤ 1
More from @htmlacademy
  1. Sep 25, 2026Скругления в неожиданных местах Скругления хороши в углах блоков, а в других местах они пр…
  2. Sep 25, 2026👍 С 25 по 27 сентября условия покупки курса или профессии предлагаете вы. Мы назвали это…
  3. Sep 18, 2026CSS shape() — фича больших надежд CSS начал вырастать из коротких штанишек квадратного веб…
  4. Sep 17, 2026🔴 Вместе с OKTTA запускаем совместную программу обучения фронтенд-разработчиков Нужна ли…
  5. Sep 16, 2026Завтра спросим у работодателя, что джун должен уметь без нейросети Эфир с руководителем ст…
  6. Sep 15, 202617 сентября в 12:00 (MSK) — прямой эфир с руководителем студии OKTTA. Студия сама делает д…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →