CSS стиль текста

Question

Есть ли способ стилизовать первое слово в теге иначе, чем другие слова в этом теге? Например, скажем, у меня был этот фрагмент кода:

<h4>Worpress Quick Tip Of The Week</h4>

Есть ли способ, которым я мог бы оформить слово "Wordpress" иначе, чем другие слова, используя css? Я знаю, что мог бы просто поместить span с уникальным классом вокруг слова Wordpress, но возможно ли это без этого?

Answer 1

Вы можете использовать псевдотэг: first-letter, если вы хотите оформить первую букву, но я не знаю тега first-word.

h4:first-letter {
  font-size: larger;
}

Answer 2

Нет, ты не можешь.

Вам нужно будет использовать другой тег.

CSS использует селекторы, которые нацелены на теги. Однако, как вы заметите, текст внутри тега - это не то, на что может нацелиться даже любой селектор. Вы нацелены на тег, который содержит текст.

Если вы можете обернуть что-нибудь вокруг этого, тогда вы могли бы. Например, просто добавьте диапазон, и тогда вы сможете:

p: первый ребенок {font-size: 2em}

Потому что первым потомком p будет span.

Answer 3

К сожалению, нет :first-word селектора.Вы можете взглянуть на этот скрипт , хотя он реализует его, добавив класс firstWord к первому слову.

span.firstWord {
  font-weight:bold;
  text-decoration: underline;
}

Answer 4

Пожалуйста, посмотрите на это.

Существует first-letter и first-line, но не first-word, однако вы можете добиться этого с помощью JavaScript.

Демонстрационный.