Podkreśl poszczególne słowa - CSS-Tricks

Anonim

Nie ma kodu CSS do stosowania podkreślenia ( text-decoration: underline;) tylko do pojedynczych słów w elemencie wielowyrazowym. Najlepszym sposobem byłoby zawinięcie każdego słowa w zakres (nie spacje, tylko słowa) w zakresach i zastosowanie podkreślenia do tych zakresów. Oto jQuery, które robi to z h1elementami.

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

Wtedy możesz zrobić:

h1 span ( text-decoration: underline; )

Podobne i nieco solidniejsze rozwiązanie: Lettering.js