Gạch chân các từ riêng lẻ - Thủ thuật CSS

Mục lục

Không có CSS ​​để chỉ áp dụng dấu gạch dưới ( text-decoration: underline;) cho các từ riêng lẻ trong một phần tử nhiều từ. Cách tốt nhất là gói mỗi từ trong một khoảng (không phải khoảng trắng, chỉ các từ) trong các nhịp và áp dụng gạch dưới cho các nhịp đó. Đây là jQuery để làm điều đó với h1các phần tử.

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

Sau đó, bạn có thể làm:

h1 span ( text-decoration: underline; )

Giải pháp tương tự và mạnh mẽ hơn một chút: Lettering.js

thú vị bài viết...