Для тренировки. Раздел периодически очищается…

https://github.com/bromite/bromite/releases/tag/79.0.3945.139

Спойлер - это такая штука, которая позволяет сворачивать часть текста прямо в строке.

Или прятать сразу несколько абзацев:

Скрыто

Текст взят отсюда: http://forwebmaster.net/prostoy-spoyler-dlya-sayta-v-html/

создается кнопочка, при нажатии на которую, сворачивается-разворачивается часть текста

prostoy-spoyler-dlya-sayta-v-html.html

<div class="spoil">
 
<div class="smallfont"><input type="button" value="Нажмите что бы открыть или закрыть спойлер" class="input-button" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Свернуть'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Текст спойлера'; }"/>
</div>
 
<div class="alt2">
 
<div style="display: none;">
Текст внутри спойлера. <br>
В разных браузерах надпись на кнопке может вести себя по разному  <br>
Например в Google Chrome Отображается только фраза <b>Нажмите что бы открыть или закрыть спойлер</b>  <br>
А вот в Mozilla Firefox при первом открытии страницы отображается длинная надпись, а после использования кнопки чередуются варианты <b>Свернуть</b> и <b>Текст спойлера</b>  <br>
Интересно что видите Вы? :-)
</div>
 
</div>
 
</div>

Как выглядит:

Это вставить до скрываемого текста
Кнопка с надписью Нажмите, чтобы скрыть или отобразить текст

<div class="spoil">
	<div class="smallfont">
		<input class="input-button" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Нажмите, чтобы скрыть или отобразить текст'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Нажмите, чтобы скрыть или отобразить текст'; }" type="button" value="Нажмите, чтобы скрыть или отобразить текст" /></div>
	<div class="alt2">
		<div style="display: none;">

Кнопка с надписью Нажмите, чтобы скрыть или отобразить информацию

<div class="spoil">
	<div class="smallfont">
		<input class="input-button" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Нажмите, чтобы скрыть или отобразить информацию'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Нажмите, чтобы скрыть или отобразить информацию'; }" type="button" value="Нажмите, чтобы скрыть или отобразить информацию" /></div>
	<div class="alt2">
		<div style="display: none;">

Это вставить после скрываемого текста

		</div>
	</div>
</div>