如何用jquery将段落的第一个字母大写但没有符号？答案

【问题标题】：How to capitalize the first letter of a paragraph with jquery but no symbols?如何用jquery将段落的第一个字母大写但没有符号？
【发布时间】：2013-07-16 20:54:22
【问题描述】：

在我的 worpdress 博客中，我使用以下 jquery 代码将第一个字母包装在 span 标记中，以便我可以将其样式设置为更大的外观：

$(".single .the_content p:first")
  .each(function () { var el = $(this), replace(/\b[a-z]/g, text = el.html(), first = text.slice(0, 1), rest = text.slice(1); el.html("<span class='capital'>" + first + "</span>" + rest); });

它工作正常但是，当我插入图像时不显示，因为图像插入代码的第一个符号“

【问题讨论】：

标签： jquery capitalize

【解决方案1】：

我认为您正在寻找 ':first-letter css 伪元素

如果你像这样添加 css：

.single .the_content p:first-letter {
    font-size: 2em;
    color: #80ffff;
}

或类似的东西，应该涵盖它。

（哦，对了，:first-childcss 伪元素）

【讨论】：

【解决方案2】：

这是一个示例，它将一系列段落的第一个字母设置为具有较大外观的样式并将其向左浮动，类似于杂志中看到的样式。

p:first-child:first-letter {
    font-size: 5em;
    float: left;
    padding: 0 10px 10px 0;
    text-transform: uppercase;
}

演示：http://jsfiddle.net/jrthib/du4qv/1/

参考：http://css-tricks.com/almanac/selectors/f/first-letter/

【讨论】：

太棒了！我真的很感谢你的帮助！ @DomDay