псевдо-селектор для заглавных букв / слов?

Question

Есть ли псевдоселектор CSS для прописных букв / букв / слов? Я хочу, чтобы все мои прописные буквы были на pt меньше, а все остальные символы одинакового размера. Прописная буква не обязательно является первым символом предложения (или слова) или наоборот.

Или, может быть, есть другой способ найти этих символов в CSS? С приколом? Я люблю трюки.

Answer 1

Ну, есть плохо поддерживаемый селектор first-letter , но это не то, что вам нужно.

Конечно, вы также можете предварительно проанализировать ваш HTML в PHP, обернув все заглавные буквыв <span class="capital"></span> тегах, но это хак.

Тогда, конечно, вы всегда можете вытащить волшебного кролика jQuery и изменить DOM при загрузке документа, чтобы включить пролеты.Это тоже хак.Тебе нравятся хаки?

Посмотрим, кто еще придумает магический трюк: -)

Answer 2

Это невозможно при использовании CSS.

Вы можете использовать Javascript, чтобы проверить все символы в вашем тексте на верхний регистр (например, с помощью if (yourtext == yourtext.toUpperCase())), а затем обернуть <span> вокруг них, содержащих ваш CSS, для их стилизации.

Или что-то вроде этих строк:

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');
    }
}

Я не пробовал (может, у кого-то есть время создать jsfiddle с этим?), Вам может понадобиться replaceNode или что-то в этом роде. Метод charCodeAt только ищет заглавные буквы, обратите внимание, что никакие символы Юникода, такие как специальные греческие заглавные буквы, не будут включены.
Теперь вам нужно только стилизовать интервал примерно так:

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

Answer 3

Я не думаю, что это возможно.

Лучше просто обернуть заглавные буквы в интервал с классом и использовать их для стилизации.