Alleviivatut sanat - CSS-temppuja

Anonim

Ei ole CSS: ää alleviivatun ( text-decoration: underline;) soveltamiseen vain yksittäisiin sanoihin monisanaisessa elementissä. Paras tapa olisi kietoa jokainen sana väliin (ei välilyöntejä, vain sanoja) alueisiin ja soveltaa alleviivausta kyseisiin alueisiin. Tässä on jQuery tehdä se h1elementeille.

$('h1').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) + ''); ) ) )); ));

Sitten voit tehdä:

h1 span ( text-decoration: underline; )

Samanlainen ja hieman vankempi ratkaisu: Lettering.js