Gariskan Perkataan Individu - Trik CSS

Anonim

Tidak ada CSS untuk menerapkan garis bawah ( text-decoration: underline;) hanya pada kata-kata individu dalam elemen berbilang kata. Cara terbaik adalah dengan membungkus setiap kata dalam rentang (bukan spasi, hanya kata-kata) dalam rentang dan menerapkan garis bawah pada rentang tersebut. Inilah jQuery untuk melakukannya ke h1elemen.

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

Maka anda boleh melakukan:

h1 span ( text-decoration: underline; )

Penyelesaian yang serupa dan sedikit lebih mantap: Huruf.js