在CSS中每个单词的目标第一个字母

问题描述：

我需要更改每个单词的每个第一个字母的大小，颜色和重量。我不是在谈论每封首字母大写。我的意思是根据我的选择定位第一个字母并应用样式。：Click Here to see example about which i am talking.在CSS中每个单词的目标第一个字母

这是一个重复：https://stackoverflow.com/questions/7440572/css-bold-first-word –

不在CSS。然而在JS中可能。同意重复 – Francisco

@DerekBrown首先看看我的问题和示例。我不需要定位段落的第一个字母。我需要在一个句子中定位每个单词的第一个字母。您提供的链接不是我的解决方案，我已经检查过此之前 –

答

不幸的是，这不能用CSS来实现，但是这里有一个JavaScript的解决方案，这将帮助你做到这一点：

CSS：

.first-letter { 
    color: red; 
}

的Html：

<p class="each-word">First letter of every word is now red!</p>

的JavaScript：

window.onload = function(){ 
    var elements = document.getElementsByClassName("each-word") 
    for (var i=0; i<elements.length; i++){ 
    elements[i].innerHTML = elements[i].innerHTML.replace(/\\b([a-z])([a-z]+)?\\b/gim, "<span class='first-letter'>$1</span>$2") 
    } 
}

答

AFAIK实现这一点，你必须写在单独的标签中的第一个字母像标签或DIV或p标签和CSS应用到该标签，并把其余的字母在普通的标签

更新：根据您的评论，如果你从文本字段中得到句子，你将不得不做一个Javascript，将遍历所有的单词和substr的帮助找到每个单词的第一个字符和appy css通过把它在一个标签，并保持休息标签外tters然后用原文替换最终输出

是的，我知道，但实际上，我从一个**分离**标签是不可能的文本字段得到这句话。 –

@Shakil艾哈迈德我已经更新了我的答案看看 –

在CSS中每个单词的目标第一个字母

相关推荐