Creo que no me se explicar bien
Tengo una tabla de contenido en css es la siguiente
Cita: <div id="indice">
<ul>
<li>
<a href="#css">CSS</a>
</li>
<li>
<a href="#html5">HTML5</a>
</li>
<li>
<a href="#php">PHP</a>
</li>
</ul>
</div>
<section>
<h3 id="css">Tutorial de CSS</h3>
<div class="section-content">
Un texto MUY largo....
</div>
</section>
<section>
<h3 id="html5">HTML 5</h3>
<div class="section-content">
Otro texto muy largo sobre HTML5
</div>
</section>
<section>
<h3 id="php">PHP</h3>
<div class="section-content">
Otro texto muy largo sobre PHP
</div>
</section>
El problema que al darle click al link y me envia en al parte donde esta el <h3></h3> me lo muestra en la parte superior de la pantalla del navegador , como hago que me muestre un poco mas abajo y que cuando me lleve al link lo haga lentamente
No se si es posible con css o javascript, le agradezco sus respuestas