HTML Tutorial

HtmL: pulsante per tornare alla pagina precedente


Durante la navigazione delle pagine web ci può far comodo inserire il una pagina del nostro sito un pulsante per tornare alla pagina precedente visualizzata con il nostro browser. Creeremo questo pulsante quindi con la dicitura "Torna indietro".

Lo possiamo creare in tre modi diversi:

  1. come semplice link
  2. come pulsante semplice
  3. come pulsante personalizzato



Per inserire un link semplice all'interno della nostra pagina web che ci porti selezionandolo alla pagina web precedentemente visitata posizionarsi dove vogliamo inserirlo e digitiamo il seguente codice HTML:

<a href="javascript:history.go(-1)" 
onMouseOver="self.status=document.referrer;return true">
Torna indietro</a>

Produrremo:

Torna indietro


Creare pulsante "Torna indietro" come pulsante semplice


Per inserire un pulsante semplice all'interno della nostra pagina web che ci porti selezionandolo alla pagina web precedentemente visitata posizionarsi dove vogliamo inserirlo e digitiamo il seguente codice HTML:

<form>
<input type="button" value="Torna indietro" 
onClick="history.go(-1);return true;" 
name="button">
</form>

Produrremo:


Creare pulsante "Torna indietro" come pulsante personalizzato


Quindi a titolo di esempio per inserire un pulsante personalizzato all'interno della nostra pagina web che ci porti selezionandolo alla pagina web precedentemente visitata posizionarsi dove vogliamo inserirlo e digitiamo il seguente codice HTML:

<form>
<INPUT TYPE="button" VALUE="Torna Indietro" 
onClick="history.go(-1);return true;" 
style="background-color: #ce401c; 
width: 10em;
padding: .5em;
color: #ffffff;
text-shadow: 1px 1px 1px #000;
font: 16px Arial, Helvetica, sans-serif;
border: solid thin #882d13;
-webkit-border-radius: .7em;
-moz-border-radius: .7em;
border-radius: .7em;
background-image: -webkit-gradient(linear, left top, left bottom,
from(#e9ede8), to(#ce401c),color-stop(0.4, #8c1b0b));">
</form>

Produrremo:


Se vogliamo modificare il layout del pulsante a questa pagina possiamo vedere come creare un pulsante personalizzato nel dettaglio:

Inserire un pulsante personalizzato usando il codice HTML