<!DOCTYPE html>
<html>
<head>
<title>Удобный слайдер для много инфы</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
.accordion {
box-sizing: border-box;
display: flex;
font-family: Arial, Helvetica, sans-serif;
overflow: hidden;
width: 100%;
}
.accordion-select {
cursor: pointer;
margin: 0;
opacity: 0;
z-index: 1;
}
.accordion-title {
position: relative;
}
.accordion-title:not(:nth-last-child(2))::after {
border: 1px solid transparent;
bottom: 0;
content: '';
left: 0;
position: absolute;
right: 0;
top: 0;
}
.accordion-title span {
bottom: 0px;
box-sizing: border-box;
display: block;
position: absolute;
white-space: nowrap;
width: 100%;
}
.accordion-content {
box-sizing: border-box;
overflow: auto;
position: relative;
transition: margin 0.3s ease 0.1s;
}
.accordion-select:checked + .accordion-title + .accordion-content {
margin-bottom: 0;
margin-right: 0;
}
/* Generated styles starts here */
.accordion {
border-color: #16535f;
border-radius: 8px;
border-style: solid;
border-width: 10px;
flex-direction: column;
height: auto;
}
.accordion-title,
.accordion-select {
background-color: #357784;
color: #05363f;
width: 100%;
height: 50px;
font-size: 20px;
}
.accordion-select {
margin-bottom: -50px;
margin-right: 0;
}
.accordion-title:not(:nth-last-child(2))::after {
border-bottom-color: rgb(27, 109, 125);
border-right-color: transparent;
}
.accordion-select:hover + .accordion-title,
.accordion-select:checked + .accordion-title {
background-color: #3c9bae;
}
.accordion-title span {
transform: rotate(0deg);
-ms-writing-mode: lr-tb;
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
padding-left: 25px;
padding-right: 25px;
line-height: 50px;
}
.accordion-content {
background-color: #e2e2e2;
color: #475052;
height: 200px;
margin-bottom: -200px;
margin-right: 0;
padding: 10px;
width: 100%;
}
</style>
</head>
<body>
<div class="accordion">
<input type="radio" name="select" class="accordion-select" checked />
<div class="accordion-title"><span>Главный заголовок под слайдеры</span></div>
<div class="accordion-content">
— Скажи-ка, дядя, ведь не даром
Москва, спаленная пожаром,
Французу отдана?
Ведь были ж схватки боевые,
Да, говорят, еще какие!
Недаром помнит вся Россия
Про день Бородина!
— Да, были люди в наше время,
Не то, что нынешнее племя:
Богатыри — не вы!
Плохая им досталась доля:
Немногие вернулись с поля…
Не будь на то господня воля,
Не отдали б Москвы!
Мы долго молча отступали,
Досадно было, боя ждали,
Ворчали старики:
«Что ж мы? на зимние квартиры?
Не смеют, что ли, командиры
Чужие изорвать мундиры
О русские штыки?»
И вот нашли большое поле:
Есть разгуляться где на воле!
Построили редут.
У наших ушки на макушке!
Чуть утро осветило пушки
И леса синие верхушки —
Французы тут как тут.
Забил заряд я в пушку туго
И думал: угощу я друга!
Постой-ка, брат мусью!
Что тут хитрить, пожалуй к бою;
Уж мы пойдем ломить стеною,
Уж постоим мы головою
За родину свою!
Два дня мы были в перестрелке.
Что толку в этакой безделке?
Мы ждали третий день.
Повсюду стали слышны речи:
«Пора добраться до картечи!»
И вот на поле грозной сечи
Ночная пала тень.
Прилег вздремнуть я у лафета,
И слышно было до рассвета,
Как ликовал француз.
Но тих был наш бивак открытый:
Кто кивер чистил весь избитый,
Кто штык точил, ворча сердито,
Кусая длинный ус.
И только небо засветилось,
Все шумно вдруг зашевелилось,
Сверкнул за строем строй.
Полковник наш рожден был хватом:
Слуга царю, отец солдатам…
Да, жаль его: сражен булатом,
Он спит в земле сырой.
И молвил он, сверкнув очами:
«Ребята! не Москва ль за нами?
Умремте же под Москвой,
Как наши братья умирали!»
И умереть мы обещали,
И клятву верности сдержали
Мы в Бородинский бой.
Ну ж был денек! Сквозь дым летучий
Французы двинулись, как тучи,
И всё на наш редут.
Уланы с пестрыми значками,
Драгуны с конскими хвостами,
Все промелькнули перед нами,
Все побывали тут.
Вам не видать таких сражений!..
Носились знамена, как тени,
В дыму огонь блестел,
Звучал булат, картечь визжала,
Рука бойцов колоть устала,
И ядрам пролетать мешала
Гора кровавых тел.
Изведал враг в тот день немало,
Что значит русский бой удалый,
Наш рукопашный бой!..
Земля тряслась — как наши груди,
Смешались в кучу кони, люди,
И залпы тысячи орудий
Слились в протяжный вой…
Вот смерклось. Были все готовы
Заутра бой затеять новый
И до конца стоять…
Вот затрещали барабаны —
И отступили бусурманы.
Тогда считать мы стали раны,
Товарищей считать.
Да, были люди в наше время,
Могучее, лихое племя:
Богатыри — не вы.
Плохая им досталась доля:
Немногие вернулись с поля.
Когда б на то не божья воля,
Не отдали б Москвы!</div>
<input type="radio" name="select" class="accordion-select" />
<div class="accordion-title"><span>Заголовок 1</span></div>
<div class="accordion-content">— Скажи-ка, дядя, ведь не даром
Москва, спаленная пожаром,
Французу отдана?
Ведь были ж схватки боевые,
Да, говорят, еще какие!
Недаром помнит вся Россия
Про день Бородина!
— Да, были люди в наше время,
Не то, что нынешнее племя:
Богатыри — не вы!
Плохая им досталась доля:
Немногие вернулись с поля…
Не будь на то господня воля,
Не отдали б Москвы!
Мы долго молча отступали,
Досадно было, боя ждали,
Ворчали старики:
«Что ж мы? на зимние квартиры?
Не смеют, что ли, командиры
Чужие изорвать мундиры
О русские штыки?»
И вот нашли большое поле:
Есть разгуляться где на воле!
Построили редут.
У наших ушки на макушке!
Чуть утро осветило пушки
И леса синие верхушки —
Французы тут как тут.
Забил заряд я в пушку туго
И думал: угощу я друга!
Постой-ка, брат мусью!
Что тут хитрить, пожалуй к бою;
Уж мы пойдем ломить стеною,
Уж постоим мы головою
За родину свою!
Два дня мы были в перестрелке.
Что толку в этакой безделке?
Мы ждали третий день.
Повсюду стали слышны речи:
«Пора добраться до картечи!»
И вот на поле грозной сечи
Ночная пала тень.
Прилег вздремнуть я у лафета,
И слышно было до рассвета,
Как ликовал француз.
Но тих был наш бивак открытый:
Кто кивер чистил весь избитый,
Кто штык точил, ворча сердито,
Кусая длинный ус.
И только небо засветилось,
Все шумно вдруг зашевелилось,
Сверкнул за строем строй.
Полковник наш рожден был хватом:
Слуга царю, отец солдатам…
Да, жаль его: сражен булатом,
Он спит в земле сырой.
И молвил он, сверкнув очами:
«Ребята! не Москва ль за нами?
Умремте же под Москвой,
Как наши братья умирали!»
И умереть мы обещали,
И клятву верности сдержали
Мы в Бородинский бой.
Ну ж был денек! Сквозь дым летучий
Французы двинулись, как тучи,
И всё на наш редут.
Уланы с пестрыми значками,
Драгуны с конскими хвостами,
Все промелькнули перед нами,
Все побывали тут.
Вам не видать таких сражений!..
Носились знамена, как тени,
В дыму огонь блестел,
Звучал булат, картечь визжала,
Рука бойцов колоть устала,
И ядрам пролетать мешала
Гора кровавых тел.
Изведал враг в тот день немало,
Что значит русский бой удалый,
Наш рукопашный бой!..
Земля тряслась — как наши груди,
Смешались в кучу кони, люди,
И залпы тысячи орудий
Слились в протяжный вой…
Вот смерклось. Были все готовы
Заутра бой затеять новый
И до конца стоять…
Вот затрещали барабаны —
И отступили бусурманы.
Тогда считать мы стали раны,
Товарищей считать.
Да, были люди в наше время,
Могучее, лихое племя:
Богатыри — не вы.
Плохая им досталась доля:
Немногие вернулись с поля.
Когда б на то не божья воля,
Не отдали б Москвы!</div>
<input type="radio" name="select" class="accordion-select" />
<div class="accordion-title"><span>Заголовок 2</span></div>
<div class="accordion-content">— Скажи-ка, дядя, ведь не даром
Москва, спаленная пожаром,
Французу отдана?
Ведь были ж схватки боевые,
Да, говорят, еще какие!
Недаром помнит вся Россия
Про день Бородина!
— Да, были люди в наше время,
Не то, что нынешнее племя:
Богатыри — не вы!
Плохая им досталась доля:
Немногие вернулись с поля…
Не будь на то господня воля,
Не отдали б Москвы!
Мы долго молча отступали,
Досадно было, боя ждали,
Ворчали старики:
«Что ж мы? на зимние квартиры?
Не смеют, что ли, командиры
Чужие изорвать мундиры
О русские штыки?»
И вот нашли большое поле:
Есть разгуляться где на воле!
Построили редут.
У наших ушки на макушке!
Чуть утро осветило пушки
И леса синие верхушки —
Французы тут как тут.
Забил заряд я в пушку туго
И думал: угощу я друга!
Постой-ка, брат мусью!
Что тут хитрить, пожалуй к бою;
Уж мы пойдем ломить стеною,
Уж постоим мы головою
За родину свою!
Два дня мы были в перестрелке.
Что толку в этакой безделке?
Мы ждали третий день.
Повсюду стали слышны речи:
«Пора добраться до картечи!»
И вот на поле грозной сечи
Ночная пала тень.
Прилег вздремнуть я у лафета,
И слышно было до рассвета,
Как ликовал француз.
Но тих был наш бивак открытый:
Кто кивер чистил весь избитый,
Кто штык точил, ворча сердито,
Кусая длинный ус.
И только небо засветилось,
Все шумно вдруг зашевелилось,
Сверкнул за строем строй.
Полковник наш рожден был хватом:
Слуга царю, отец солдатам…
Да, жаль его: сражен булатом,
Он спит в земле сырой.
И молвил он, сверкнув очами:
«Ребята! не Москва ль за нами?
Умремте же под Москвой,
Как наши братья умирали!»
И умереть мы обещали,
И клятву верности сдержали
Мы в Бородинский бой.
Ну ж был денек! Сквозь дым летучий
Французы двинулись, как тучи,
И всё на наш редут.
Уланы с пестрыми значками,
Драгуны с конскими хвостами,
Все промелькнули перед нами,
Все побывали тут.
Вам не видать таких сражений!..
Носились знамена, как тени,
В дыму огонь блестел,
Звучал булат, картечь визжала,
Рука бойцов колоть устала,
И ядрам пролетать мешала
Гора кровавых тел.
Изведал враг в тот день немало,
Что значит русский бой удалый,
Наш рукопашный бой!..
Земля тряслась — как наши груди,
Смешались в кучу кони, люди,
И залпы тысячи орудий
Слились в протяжный вой…
Вот смерклось. Были все готовы
Заутра бой затеять новый
И до конца стоять…
Вот затрещали барабаны —
И отступили бусурманы.
Тогда считать мы стали раны,
Товарищей считать.
Да, были люди в наше время,
Могучее, лихое племя:
Богатыри — не вы.
Плохая им досталась доля:
Немногие вернулись с поля.
Когда б на то не божья воля,
Не отдали б Москвы!</div>
<input type="radio" name="select" class="accordion-select" />
<div class="accordion-title"><span>Заголовок 3</span></div>
<div class="accordion-content">— Скажи-ка, дядя, ведь не даром
Москва, спаленная пожаром,
Французу отдана?
Ведь были ж схватки боевые,
Да, говорят, еще какие!
Недаром помнит вся Россия
Про день Бородина!
— Да, были люди в наше время,
Не то, что нынешнее племя:
Богатыри — не вы!
Плохая им досталась доля:
Немногие вернулись с поля…
Не будь на то господня воля,
Не отдали б Москвы!
Мы долго молча отступали,
Досадно было, боя ждали,
Ворчали старики:
«Что ж мы? на зимние квартиры?
Не смеют, что ли, командиры
Чужие изорвать мундиры
О русские штыки?»
И вот нашли большое поле:
Есть разгуляться где на воле!
Построили редут.
У наших ушки на макушке!
Чуть утро осветило пушки
И леса синие верхушки —
Французы тут как тут.
Забил заряд я в пушку туго
И думал: угощу я друга!
Постой-ка, брат мусью!
Что тут хитрить, пожалуй к бою;
Уж мы пойдем ломить стеною,
Уж постоим мы головою
За родину свою!
Два дня мы были в перестрелке.
Что толку в этакой безделке?
Мы ждали третий день.
Повсюду стали слышны речи:
«Пора добраться до картечи!»
И вот на поле грозной сечи
Ночная пала тень.
Прилег вздремнуть я у лафета,
И слышно было до рассвета,
Как ликовал француз.
Но тих был наш бивак открытый:
Кто кивер чистил весь избитый,
Кто штык точил, ворча сердито,
Кусая длинный ус.
И только небо засветилось,
Все шумно вдруг зашевелилось,
Сверкнул за строем строй.
Полковник наш рожден был хватом:
Слуга царю, отец солдатам…
Да, жаль его: сражен булатом,
Он спит в земле сырой.
И молвил он, сверкнув очами:
«Ребята! не Москва ль за нами?
Умремте же под Москвой,
Как наши братья умирали!»
И умереть мы обещали,
И клятву верности сдержали
Мы в Бородинский бой.
Ну ж был денек! Сквозь дым летучий
Французы двинулись, как тучи,
И всё на наш редут.
Уланы с пестрыми значками,
Драгуны с конскими хвостами,
Все промелькнули перед нами,
Все побывали тут.
Вам не видать таких сражений!..
Носились знамена, как тени,
В дыму огонь блестел,
Звучал булат, картечь визжала,
Рука бойцов колоть устала,
И ядрам пролетать мешала
Гора кровавых тел.
Изведал враг в тот день немало,
Что значит русский бой удалый,
Наш рукопашный бой!..
Земля тряслась — как наши груди,
Смешались в кучу кони, люди,
И залпы тысячи орудий
Слились в протяжный вой…
Вот смерклось. Были все готовы
Заутра бой затеять новый
И до конца стоять…
Вот затрещали барабаны —
И отступили бусурманы.
Тогда считать мы стали раны,
Товарищей считать.
Да, были люди в наше время,
Могучее, лихое племя:
Богатыри — не вы.
Плохая им досталась доля:
Немногие вернулись с поля.
Когда б на то не божья воля,
Не отдали б Москвы!</div>
<input type="radio" name="select" class="accordion-select" />
<div class="accordion-title"><span>Заголовок 4</span></div>
<div class="accordion-content">— Скажи-ка, дядя, ведь не даром
Москва, спаленная пожаром,
Французу отдана?
Ведь были ж схватки боевые,
Да, говорят, еще какие!
Недаром помнит вся Россия
Про день Бородина!
— Да, были люди в наше время,
Не то, что нынешнее племя:
Богатыри — не вы!
Плохая им досталась доля:
Немногие вернулись с поля…
Не будь на то господня воля,
Не отдали б Москвы!
Мы долго молча отступали,
Досадно было, боя ждали,
Ворчали старики:
«Что ж мы? на зимние квартиры?
Не смеют, что ли, командиры
Чужие изорвать мундиры
О русские штыки?»
И вот нашли большое поле:
Есть разгуляться где на воле!
Построили редут.
У наших ушки на макушке!
Чуть утро осветило пушки
И леса синие верхушки —
Французы тут как тут.
Забил заряд я в пушку туго
И думал: угощу я друга!
Постой-ка, брат мусью!
Что тут хитрить, пожалуй к бою;
Уж мы пойдем ломить стеною,
Уж постоим мы головою
За родину свою!
Два дня мы были в перестрелке.
Что толку в этакой безделке?
Мы ждали третий день.
Повсюду стали слышны речи:
«Пора добраться до картечи!»
И вот на поле грозной сечи
Ночная пала тень.
Прилег вздремнуть я у лафета,
И слышно было до рассвета,
Как ликовал француз.
Но тих был наш бивак открытый:
Кто кивер чистил весь избитый,
Кто штык точил, ворча сердито,
Кусая длинный ус.
И только небо засветилось,
Все шумно вдруг зашевелилось,
Сверкнул за строем строй.
Полковник наш рожден был хватом:
Слуга царю, отец солдатам…
Да, жаль его: сражен булатом,
Он спит в земле сырой.
И молвил он, сверкнув очами:
«Ребята! не Москва ль за нами?
Умремте же под Москвой,
Как наши братья умирали!»
И умереть мы обещали,
И клятву верности сдержали
Мы в Бородинский бой.
Ну ж был денек! Сквозь дым летучий
Французы двинулись, как тучи,
И всё на наш редут.
Уланы с пестрыми значками,
Драгуны с конскими хвостами,
Все промелькнули перед нами,
Все побывали тут.
Вам не видать таких сражений!..
Носились знамена, как тени,
В дыму огонь блестел,
Звучал булат, картечь визжала,
Рука бойцов колоть устала,
И ядрам пролетать мешала
Гора кровавых тел.
Изведал враг в тот день немало,
Что значит русский бой удалый,
Наш рукопашный бой!..
Земля тряслась — как наши груди,
Смешались в кучу кони, люди,
И залпы тысячи орудий
Слились в протяжный вой…
Вот смерклось. Были все готовы
Заутра бой затеять новый
И до конца стоять…
Вот затрещали барабаны —
И отступили бусурманы.
Тогда считать мы стали раны,
Товарищей считать.
Да, были люди в наше время,
Могучее, лихое племя:
Богатыри — не вы.
Плохая им досталась доля:
Немногие вернулись с поля.
Когда б на то не божья воля,
Не отдали б Москвы!</div>
<input type="radio" name="select" class="accordion-select" />
<div class="accordion-title"><span>Заголовок 5</span></div>
<div class="accordion-content">— Скажи-ка, дядя, ведь не даром
Москва, спаленная пожаром,
Французу отдана?
Ведь были ж схватки боевые,
Да, говорят, еще какие!
Недаром помнит вся Россия
Про день Бородина!
— Да, были люди в наше время,
Не то, что нынешнее племя:
Богатыри — не вы!
Плохая им досталась доля:
Немногие вернулись с поля…
Не будь на то господня воля,
Не отдали б Москвы!
Мы долго молча отступали,
Досадно было, боя ждали,
Ворчали старики:
«Что ж мы? на зимние квартиры?
Не смеют, что ли, командиры
Чужие изорвать мундиры
О русские штыки?»
И вот нашли большое поле:
Есть разгуляться где на воле!
Построили редут.
У наших ушки на макушке!
Чуть утро осветило пушки
И леса синие верхушки —
Французы тут как тут.
Забил заряд я в пушку туго
И думал: угощу я друга!
Постой-ка, брат мусью!
Что тут хитрить, пожалуй к бою;
Уж мы пойдем ломить стеною,
Уж постоим мы головою
За родину свою!
Два дня мы были в перестрелке.
Что толку в этакой безделке?
Мы ждали третий день.
Повсюду стали слышны речи:
«Пора добраться до картечи!»
И вот на поле грозной сечи
Ночная пала тень.
Прилег вздремнуть я у лафета,
И слышно было до рассвета,
Как ликовал француз.
Но тих был наш бивак открытый:
Кто кивер чистил весь избитый,
Кто штык точил, ворча сердито,
Кусая длинный ус.
И только небо засветилось,
Все шумно вдруг зашевелилось,
Сверкнул за строем строй.
Полковник наш рожден был хватом:
Слуга царю, отец солдатам…
Да, жаль его: сражен булатом,
Он спит в земле сырой.
И молвил он, сверкнув очами:
«Ребята! не Москва ль за нами?
Умремте же под Москвой,
Как наши братья умирали!»
И умереть мы обещали,
И клятву верности сдержали
Мы в Бородинский бой.
Ну ж был денек! Сквозь дым летучий
Французы двинулись, как тучи,
И всё на наш редут.
Уланы с пестрыми значками,
Драгуны с конскими хвостами,
Все промелькнули перед нами,
Все побывали тут.
Вам не видать таких сражений!..
Носились знамена, как тени,
В дыму огонь блестел,
Звучал булат, картечь визжала,
Рука бойцов колоть устала,
И ядрам пролетать мешала
Гора кровавых тел.
Изведал враг в тот день немало,
Что значит русский бой удалый,
Наш рукопашный бой!..
Земля тряслась — как наши груди,
Смешались в кучу кони, люди,
И залпы тысячи орудий
Слились в протяжный вой…
Вот смерклось. Были все готовы
Заутра бой затеять новый
И до конца стоять…
Вот затрещали барабаны —
И отступили бусурманы.
Тогда считать мы стали раны,
Товарищей считать.
Да, были люди в наше время,
Могучее, лихое племя:
Богатыри — не вы.
Плохая им досталась доля:
Немногие вернулись с поля.
Когда б на то не божья воля,
Не отдали б Москвы!</div>
<input type="radio" name="select" class="accordion-select" />
<div class="accordion-title"><span>Заголовок 6</span></div>
<div class="accordion-content">— Скажи-ка, дядя, ведь не даром
Москва, спаленная пожаром,
Французу отдана?
Ведь были ж схватки боевые,
Да, говорят, еще какие!
Недаром помнит вся Россия
Про день Бородина!
— Да, были люди в наше время,
Не то, что нынешнее племя:
Богатыри — не вы!
Плохая им досталась доля:
Немногие вернулись с поля…
Не будь на то господня воля,
Не отдали б Москвы!
Мы долго молча отступали,
Досадно было, боя ждали,
Ворчали старики:
«Что ж мы? на зимние квартиры?
Не смеют, что ли, командиры
Чужие изорвать мундиры
О русские штыки?»
И вот нашли большое поле:
Есть разгуляться где на воле!
Построили редут.
У наших ушки на макушке!
Чуть утро осветило пушки
И леса синие верхушки —
Французы тут как тут.
Забил заряд я в пушку туго
И думал: угощу я друга!
Постой-ка, брат мусью!
Что тут хитрить, пожалуй к бою;
Уж мы пойдем ломить стеною,
Уж постоим мы головою
За родину свою!
Два дня мы были в перестрелке.
Что толку в этакой безделке?
Мы ждали третий день.
Повсюду стали слышны речи:
«Пора добраться до картечи!»
И вот на поле грозной сечи
Ночная пала тень.
Прилег вздремнуть я у лафета,
И слышно было до рассвета,
Как ликовал француз.
Но тих был наш бивак открытый:
Кто кивер чистил весь избитый,
Кто штык точил, ворча сердито,
Кусая длинный ус.
И только небо засветилось,
Все шумно вдруг зашевелилось,
Сверкнул за строем строй.
Полковник наш рожден был хватом:
Слуга царю, отец солдатам…
Да, жаль его: сражен булатом,
Он спит в земле сырой.
И молвил он, сверкнув очами:
«Ребята! не Москва ль за нами?
Умремте же под Москвой,
Как наши братья умирали!»
И умереть мы обещали,
И клятву верности сдержали
Мы в Бородинский бой.
Ну ж был денек! Сквозь дым летучий
Французы двинулись, как тучи,
И всё на наш редут.
Уланы с пестрыми значками,
Драгуны с конскими хвостами,
Все промелькнули перед нами,
Все побывали тут.
Вам не видать таких сражений!..
Носились знамена, как тени,
В дыму огонь блестел,
Звучал булат, картечь визжала,
Рука бойцов колоть устала,
И ядрам пролетать мешала
Гора кровавых тел.
Изведал враг в тот день немало,
Что значит русский бой удалый,
Наш рукопашный бой!..
Земля тряслась — как наши груди,
Смешались в кучу кони, люди,
И залпы тысячи орудий
Слились в протяжный вой…
Вот смерклось. Были все готовы
Заутра бой затеять новый
И до конца стоять…
Вот затрещали барабаны —
И отступили бусурманы.
Тогда считать мы стали раны,
Товарищей считать.
Да, были люди в наше время,
Могучее, лихое племя:
Богатыри — не вы.
Плохая им досталась доля:
Немногие вернулись с поля.
Когда б на то не божья воля,
Не отдали б Москвы!</div>
</div>
</body>
</html> 
(не в обиду написал, а к тому что теряете время на написание и подгонку кодов и как бы "время-это деньги")
