disign | Sottolineare singole parole | a digital sign for a best design!
A digital sign for a best design

Articolo stampato da http://disign.improntedigitali.it/sottolineare-singole-parole-484-3-1.html

© Luca Frassineti

Css tips and tricks 3.759 visualizzazioni

Sottolineare singole parole

22/07/2013

La regola css text-decoration: underline; non permette la sottolineatura delle singole parole ma applica il sottolinetao anche agli spazi compresi nel testo, e non esiste alternativa CSS per farlo.

Come spesso accade ci viene in aiuto la libreria Jqury per ovviare alla bisogna !

Nell'esempio utilizziamo un tag H6 a cui far apllicare automaticamente la sottolineatura per singola parola.

Dopo aver fatto la classica chiamata alla libreria Jquery più aggiornata, come descritto in questo articolo, definiamo la function al document ready

 

$('h6').each(function() {

	var words = $(this).text().split(' ');

	$(this).empty().html(function() {

		for (i = 0; i < words.length; i++) {
			if (i == 0) {
				$(this).append('' + words[i] + '');
			} else {
				$(this).append(' ' + words[i] + '');
			}
		}
	
	});

});

infine nel nostro CSS ricordiamoci di inserire la regola


h1 span { text-decoration: underline; }

Invia una domanda o un commento sull'articolo

I campi obbligatori sono segnalati *

*

*



 


Questo sito è totalmente privo di pubblicità, se volete sostenere questa inziativa, potete scegliere di fare una piccola donazione libera:


© 2009 - 2024 Impronte digitali di Luca Frassineti. Tutti i diritti riservati.