First lowercase the text then capitalize it. Is it possible with CSS?

First lowercase the text then capitalize it. Is it possible with CSS?

Edit: Example: HELLO WORLD -> Hello World

Edit2: I have a list of countries which are all uppercase, like UNITED KINGDOM, I have to make it look like United Kingdom.


Solution 1:

Yep:

.className {
    text-transform:capitalize;
}

Javascript:

function capitalize(s){
    return s.toLowerCase().replace( /\b./g, function(a){ return a.toUpperCase(); } );
};

capitalize('this IS THE wOrst string eVeR');

Stolen from here: Capitalize words in string

Solution 2:

I not have permission to comment, so I'll write my experience as an answer.

I have a problem with accentuated chars, solved puting '^' in the begin of regex and iterate each word of the text.

'^' indicates to match only the first char of word.

function captalize(s) {
    return s.toLowerCase().replace( /^\b./g, function(a){ return a.toUpperCase(); } );
}

var words = exampleText.split(" ");

jQuery.each(words, function(index, value) {
       var w = capitalize(value);
       exampleText.append(w).append(" ");
});