在CSS中每個單詞的目標第一個字母

我需要更改每個單詞的每個第一個字母的大小，顏色和重量。我不是在談論每封首字母大寫。我的意思是根據我的選擇定位第一個字母並應用樣式。：Click Here to see example about which i am talking.在CSS中每個單詞的目標第一個字母

來源

2017-10-20 Shakil Ahmad

這是一個重複：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") 
    } 
}

來源

2017-10-21 21:51:31

AFAIK實現這一點，你必須寫在單獨的標籤中的第一個字母像標籤或DIV或p標籤和CSS應用到該標籤，並把其餘的字母在普通的標籤

更新：根據您的評論，如果你從文本字段中得到句子，你將不得不做一個Javascript，將遍歷所有的單詞和substr的幫助找到每個單詞的第一個字符和appy css通過把它在一個標籤，並保持休息標籤外tters然後用原文替換最終輸出

來源

2017-10-20 16:45:45

是的，我知道，但實際上，我從一個**分離**標籤是不可能的文本字段得到這句話。 –

@Shakil艾哈邁德我已經更新了我的答案看看 –

在CSS中每個單詞的目標第一個字母

回答

相關問題