CSS text-transform: großschreibung;kapitalize bei allen Großbuchstaben

Question

Hier ist mein HTML:

kleine Großbuchstaben & 
GROßBUCHSTABEN

Hier ist mein CSS:

.link {text-transform: capitalize;}

Das Ergebnis ist:

Kleine Großbuchstaben & GROßBUCHSTABEN

Und ich möchte das Ergebnis sein:

Kleine Großbuchstaben & Alle Großbuchstaben

Irgendwelche Ideen?

Answer 1

JavaScript:

var links = document.getElementsByClassName("link");
for (var i = 0; i < links.length; i++) {
  links[i].innerHTML = links[i].innerHTML.toLowerCase();
}

CSS:

.link { text-transform: capitalize; }

---

Was Khan "am Ende bewirken" (was sauberer ist und für mich funktioniert hat) unten in den Kommentaren des als Antwort markierten Beitrags gemacht hat.

Answer 2

großschreibung wirkt sich nur auf den ersten Buchstaben des Wortes aus. http://www.w3.org/TR/CSS21/text.html#propdef-text-transform

Answer 3

Du kannst es mit CSS ::first-letter machen! Zum Beispiel wollte ich es für das Menü:

a {display:inline-block; text-transorm:uppercase;}
a::first-letter {font-size:50px;}

Es funktioniert nur mit Block-Elementen - deshalb das inline-block!

Answer 4

Kann für Java und JSTL nützlich sein.

1. Initialisiere die Variable mit der lokalisierten Nachricht.
2. Danach ist es möglich, sie in JSTL mit der toLowerCase-Funktion zu verwenden.
3. Mit CSS transformieren.

In JSP

1.

2.

  ${fn:toLowerCase(item)}

In CSS

3.

.content {
  text-transform:capitalize;
}

Answer 5

Wenn die Daten aus einer Datenbank stammen, wie in meinem Fall, können Sie sie vor dem Senden an eine Auswahlliste/ Dropdown-Liste reduzieren. Schade, dass man es nicht mit CSS machen kann.