A resposta da @ voyager sobre o uso do data-*
atributo (por exemplo, data-gender="female|male"
é a abordagem mais eficaz e compatível com os padrões a partir de 2017:
[data-gender='male'] {background-color: #000; color: #ccc;}
Quase todos os objetivos podem ser alcançados, pois existem alguns seletores, embora limitados, orientados ao redor do texto. A :: first-letter é um pseudo-elemento que pode aplicar um estilo limitado à primeira letra de um elemento. Há também um pseudo-elemento :: first-line , além de obviamente selecionar a primeira linha de um elemento (como um parágrafo) também implica que é óbvio que o CSS pode ser usado para estender esse recurso existente para estilizar aspectos específicos de um textNode .
Até que essa defesa seja bem - sucedida e seja implementada, a próxima melhor coisa que eu poderia sugerir, quando aplicável, é explode
/ split
words usando um delimitador de espaço, produza cada palavra individual dentro de um span
elemento e, em seguida, se o objetivo da palavra / estilo for previsível, em combinação com : nth seletores :
$p = explode(' ',$words);
foreach ($p as $key1 => $value1)
{
echo '<span>'.$value1.'</span>;
}
Else se não previsível para, mais uma vez, a resposta uso da Voyager sobre o uso do data-*
atributo. Um exemplo usando o PHP:
$p = explode(' ',$words);
foreach ($p as $key1 => $value1)
{
echo '<span data-word="'.$value1.'">'.$value1.'</span>;
}