<p>THIS IS SOMETEXT</p>
Я хочу, чтобы это выглядело так. This is sometext
котором первая буква абзаца имеет верхний регистр.
Возможно ли это в CSS?
Изменить: весь мой текст заглавными буквами.
<p>THIS IS SOMETEXT</p>
Я хочу, чтобы это выглядело так. This is sometext
котором первая буква абзаца имеет верхний регистр.
Возможно ли это в CSS?
Изменить: весь мой текст заглавными буквами.
Вы можете использовать text-transform
, чтобы каждое слово абзаца было капитализировано следующим образом:
p { text-transform: capitalize; }
Он был поддержан в IE4+. Пример здесь.
16.5. Капитализация: свойство "текстовое преобразование"
Это свойство управляет эффектами капитализации текста элемента.
capitalize
Помещает первый символ каждого слова в верхнем регистре; другие символы не затронуты.
В этом предположении было следующее:
Я хочу сделать так:
This Is Sometext
Вы должны обернуть каждое слово с помощью элемента оболочки, такого как <span>
и использовать :first-letter
псевдо-элемент с первой буквой, чтобы преобразовать первую букву каждого слова:
<p>
<span>THIS</span> <span>IS</span> <span>SOMETEXT</span>
</p>
p { text-transform: lowercase; } /* Make all letters lowercase */
p > span { display: inline-block; } /* :first-letter is applicable to blocks */
p > span:first-letter {
text-transform: uppercase; /* Make the first letters uppercase */
}
Кроме того, вы можете использовать JavaScript, чтобы обернуть каждое слово элементом <span>
:
var words = $("p").text().split(" ");
$("p").empty();
$.each(words, function(i, v) {
$("p").append($("<span>").text(v)).append(" ");
});
Кажется, это то, что вы действительно ищете, это довольно просто, все, что вам нужно сделать, это сделать все слова в нижнем регистре, а затем преобразовать первую букву абзаца в верхний регистр:
p { text-transform: lowercase; }
p:first-letter {
text-transform: uppercase;
}
Попробуй это:
<style>
p {
text-transform: lowercase;
}
p:first-letter {
text-transform: uppercase;
}
</style>
я понял
p {
text-transform: lowercase;
}
p:first-letter {
text-transform: uppercase;
}