pseudo selettore per caratteri/parole maiuscole?

Question

C'è uno pseudoselettore CSS per caratteri maiuscoli/lettere/parole? Voglio che tutte le mie maiuscole siano un pt più piccolo e tutti gli altri personaggi della stessa dimensione. Una maiuscola non è necessariamente il primo carattere di una frase (o parola) né il contrario.

O forse c'è un altro modo per trovare questi personaggi in CSS? Con un trucco? Mi piacciono i trucchi.

Answer 1

Beh, c'è il povero supportato selettore first-letter, ma non è questo ciò che si desidera.

Naturalmente è possibile anche analizzare l'HTML in PHP, avvolgendo tutti i maiuscoletti nei tag <span class="capital"></span>, ma si tratta di un trucco.

Poi, naturalmente, si può sempre tirare fuori la magia di coniglio jQuery e alterare la vostra DOM a carico documento per includere le campate. Questo è anche un trucco. Ti piacciono gli hack?

Vediamo chi altro si trasforma con un trucco di magia :-)

Answer 2

Non credo sia possibile.

Meglio avvolgere solo le lettere maiuscole con una campata con una classe e l'uso che per lo stile di loro.

Answer 3

Questo non è possibile utilizzare i CSS.

È possibile utilizzare Javascript per controllare tutti i caratteri del testo in maiuscolo (ad esempio utilizzando if (yourtext == yourtext.toUpperCase())) e quindi racchiudere uno <span> attorno a essi contenente il CSS per modellare questi caratteri.

O qualcosa intorno a queste linee: (? Forse qualcuno ha il tempo per creare un jsfiddle con questo)

function wrapCaps() { 
    var text = document.getElementById("my_text").value; 
    for(i=0; i < text.length; i++) { 
     if(text[i].charCodeAt(text[i]) >= 65 && text[i].charCodeAt(text[i]) <= 90) 
     wrapNode(text[i], 'span'); 
    } 
} 

non ho provarlo, potrebbe essere necessario utilizzare replaceNode o qualcosa del genere. Il metodo charCodeAt cerca solo lettere maiuscole, si noti che non saranno inclusi caratteri unicode come lettere maiuscole greche speciali.
Ora solo bisogno per lo stile il vostro arco con qualcosa di simile:

#my_text span { 
    font-size: 10px; 
}