Tramite i CSS è possibile alterare il design di elementi fino a farli sembrare tutt'altro. Nel breve articolo in oggetto mostrerò come far apparire con il solo utilizzo di una classe CSS un bottone, sia esso di tipo button che submit, come se fosse un link ipertestuale.
La tecnica può trovare spazio in molti contesti, uno di essi può essere il caso in cui ci venga fornita una grafica dove, sotto ad alcuni campi di testo, al posto di un bottone è stato inserito un link per l'invio di dati via ajax quando noi potremo preferire invece un classico form con il submit; in questo modo il bottone del submit può essere cammuffato da link pur continuando a svolgere la sua funzionalità nativa.
Ponendo di voler modificare l'aspetto di un bottone di tipo submit:
<input type="submit" value ="clicca qui" class="likelink" />Il codice CSS da assegnare alla classe (nell'esempio in questione .likelink) è il seguente:
.likelink {
background:none!important;
border:none;
padding:0!important;
font-family:arial,sans-serif;
color:#069;
text-decoration:underline;
cursor:pointer;
}Il risultato è apprezzabile di seguito:
Dove è facile identificare quale sia il bottone nativo e quello modificato nell'aspetto per farlo assomigliare ad un link.
Simpatica soluzione! Effettivamente i template di oggi offrono sempre meno spazio ai bottoni, anche quelli che a volte sembrano dei veri e propri bottoni si rivelano dei link mascherati