CSS没有提供只为多词元素中的单个单词应用下划线（text-decoration: underline;）的方法。最好的方法是将每个单词（不包括空格）用span标签包裹起来，然后为这些span标签应用下划线。以下是用jQuery为h1元素执行此操作的代码。
$('h1').each(function() {
var words = $(this).text().split(' ');
$(this).empty().html(function() {
for (i = 0; i < words.length; i++) {
if (i == 0) {
$(this).append('<span>' + words[i] + '</span>');
} else {
$(this).append(' <span>' + words[i] + '</span>');
}
}
});
});然后你可以执行以下操作
h1 span {
text-decoration: underline;
}类似且稍微更强大的解决方案：Lettering.js
对于原始JS版本
我相信我稍微减少了代码量。尽管你的版本更加抽象，并使用了更易于维护的代码。
哇，抱歉 :P 在</span>和<span>之间应该有一个空格。
注意：如果你使用for循环，应该用var关键字声明i变量。查看这里了解原因。
此外，如果此for循环发现长度为0，它将永远不会到达循环内部并会在启动内部代码之前中断。因此，你的if-else语句完全被忽略，因为只有else情况才能为真。if永远不会被执行，因为for循环在执行之前就中断了。
参考中的代码是正确的，但是此页面上的代码缺少append()中的span标签。
我的错，已修复。
尽管原始JS版本也不错。jQuery版本中也可以获得一些性能提升。为什么调用$.fn.each、$.fn.empty、$.fn.html，然后十几次回调$.fn.append？
* empty() 只是冗余的
* 在html内部调用append() 没有意义。要么在外部构建并多次调用$(this).append()，要么在内部构建并调用$(this).html(stuff); 后者是推荐的做法。
* 你正在使用text() 获取值，但使用html()/append() 放回它。在处理用户输入时，这非常危险，如果标题中存在任何HTML内容，也可能会破坏你的布局。在此处构建字符串时必须转义html（或使用$.fn.text）。
* 不要忘记在for循环中使用'var' 而不是i。或者将其移动到for循环外部的变量列表中，这样可以节省一些位，避免启动两个var语句（这些都是一个var语句，而不是它们用逗号分隔的方式）。
如何在html css中添加小的下划线
尽管原始JS版本也不错。jQuery版本中也可以获得一些性能提升。为什么调用$.fn.each、$.fn.empty、$.fn.html，然后十几次回调$.fn.append？
* empty() 只是冗余的
* 在html内部调用append() 没有意义。要么在外部构建并多次调用$(this).append()，要么在内部构建并调用$(this).html(stuff); 后者是推荐的做法。
* 你正在使用text() 获取值，但使用html()/append() 放回它。在处理用户输入时，这非常危险，如果标题中存在任何HTML内容，也可能会破坏你的布局。在此处构建字符串时必须转义html（或使用$.fn.text）。
* 不要忘记在for循环中使用'var' 而不是i。或者将其移动到for循环外部的变量列表中，这样可以节省一些位，避免启动两个var语句（这些都是一个var语句，而不是它们用逗号分隔的方式）。
Chris，请告诉我如何在脚本中不仅应用于h1，还应用于h2。
提前感谢，Ecatherina。
谢谢
我需要一些css代码，请帮忙
CSS在参考URL中。
你们的导师很棒...
我喜欢它。。
好游戏！真正让我们恼火的是，如果要以单人模式玩游戏，需要单独的网络连接。我的意思是，这到底是什么鬼？
我的版本接受非最终节点！
gist
https://gist.github.com/yukulele/8668962
pen
http://codepen.io/yukulele/pen/zrefF
有没有办法用if then语句做到这一点？例如，仅当有多个单词时才将第一个单词更改为红色？我希望只有在标题中有多个单词时，span 'word1' 才会变为红色，其余单词将为黑色。否则，word1 将为黑色。