function view(n) {
style = document.getElementById(n).style;
style.display = (style.display == 'block') ? 'none' : 'block';
}
<div class="wrap">
<p>С помощью нескольких строк javascript, вы сможете легко организовать <span class="tt" onclick="view('t1'); return false">скрытые блоки с содержанием</span>, раскрывающиеся по клику.</p>
<span id="t1" class="terms">
Самый известный пример использования скрытого текста, это хорошо всем знакомые "спойлеры" на форумах .....
</span>
<p>Согласитесь, иногда лучше сделать маленький блок скрытого текста с аккуратной кникабельной надписью, например: <span class="tt" onclick="view('t2'); return false">правила комментирования</span>.</p>
<span id="t2" class="terms">
Краткость сестра таланта. Если Вы уверены, что талантливы, будьте кратки......
</span>
<p>Тот, кому оно надо - нажмёт на надпись и всё увидит. Совершенно нет надобности постоянно держать на виду у всех эти самые правила)))</p>
</div>
/* контейнер демо */
body{
font-family: helvetica, arial;
}
.wrap {
max-width: 860px;
padding: 10px;
margin: 0 auto;
}
/* скрытый блок */
.terms {
display:none;
margin:5px 0px;
padding:10px;
width:98%;
border:1px solid #ffbc80;
background:#ffffdf;
}
/* кликабельный текст */
.tt {
color:#f70;
cursor: help
}
.tt:hover{
border-bottom:1px dashed green;
color:green;
}