Você pode especificar as cores, tamanhos e outros parâmetros da fonte em uma folha de estilo CSS externa. Se você quiser alterar a cor de apenas uma palavra ou frase, a maneira mais fácil e simples é usar a tag embutida. CSS embutido é exatamente o que parece: ele é adicionado no HTML da página, ao invés de uma folha de estilo externa.
Evite usar a tag, que se tornou obsoleta.
Veja como alterar a cor de uma palavra usando a tag:
Usando o seu editor de texto ou HTML preferido no modo de visualização de código, coloque o cursor antes da primeira letra da palavra ou grupo de palavras que deseja colorir.
Vamos quebrar o texto cuja cor deseja alterar com uma tag, incluindo um atributo de classe. O parágrafo inteiro pode ter a seguinte aparência: Este é o texto enfocado em uma frase.
-
Dê a esse texto específico um "gancho" que possamos usar em CSS. Nossa próxima etapa é pular para nosso arquivo CSS externo para adicionar uma nova regra.
Em nosso arquivo CSS, vamos adicionar:
.focus-text {
cor: # F00;
}
Essa regra definiria esse elemento embutido, o, para ser exibido na cor vermelha. Se tivéssemos um estilo anterior que definisse o texto do nosso documento como preto, esse estilo embutido faria com que o texto da extensão fosse focalizado e se destacasse com a cor diferente. Poderíamos também adicionar outros estilos a esta regra, talvez deixando o texto em itálico ou negrito para enfatizá-lo ainda mais?
-
Salve sua página.
Teste a página em seu navegador favorito para ver as alterações em vigor.
Observe que, além do, alguns profissionais da web optam por usar outros elementos, como os pares de tags ou. Essas tags costumavam ser usadas especificamente para negrito e itálico, mas foram descontinuadas e substituídas por e. As tags ainda funcionam em navegadores modernos, no entanto, muitos desenvolvedores da web as usam como ganchos de estilo embutidos. Essa não é a pior abordagem, mas se você quiser evitar qualquer elemento obsoleto, sugerimos manter a tag para esses tipos de necessidades de estilo.
Dicas e coisas a serem observadas
Embora essa abordagem funcione bem para pequenas necessidades de estilo, como se você precisar alterar apenas uma pequena parte do texto em um documento, ela pode sair rapidamente do controle. Se você achar que sua página está repleta de elementos embutidos, todos com classes exclusivas que você está usando em seu arquivo CSS, você pode estar fazendo errado, lembre-se, quanto mais dessas tags estiverem em sua página, mais difícil será manter a página funcionando frente. Além disso, uma boa tipografia da web raramente tem tantas variantes de cor etc. em toda a página.