Sobre este problema de CSS
As propriedades font-style e font-weight servem propósitos diferentes. font-style controla se o texto aparece num estilo normal, itálico ou oblíquo, enquanto font-weight controla quão espessos ou finos os caracteres são renderizados. Escrever font-style: bold é um erro porque bold não está entre os valores aceites para font-style. Os navegadores irão ignorar completamente a declaração inválida, o que significa que o seu texto não ficará negrito — simplesmente renderizará no peso padrão.
Este erro geralmente vem da confusão entre as duas propriedades ou de esquecer qual propriedade lida com o negrito. Os valores válidos para cada propriedade são:
-
font-style:normal,italic,oblique, ouobliquecom um ângulo (por exemplo,oblique 10deg) -
font-weight:normal,bold,bolder,lighter, ou valores numéricos de100a900
Para corrigir este problema, substitua font-style: bold por font-weight: bold. Se pretendeu tornar o texto negrito e itálico, precisará usar ambas as propriedades separadamente.
Exemplos
Incorreto — usar bold com font-style
Isto desencadeia o erro de validação porque bold não é um valor font-style válido:
<p style="font-style: bold;">Este texto não ficará negrito.</p>
Correto — usar font-weight para negrito
Mova o valor bold para a propriedade font-weight:
<p style="font-weight: bold;">Este texto está negrito.</p>
Correto — combinar negrito e itálico
Se quiser texto que seja negrito e itálico, use ambas as propriedades:
<p style="font-weight: bold; font-style: italic;">Este texto está negrito e itálico.</p>
Correto — usar font-weight numa folha de estilos
Também pode aplicar estilos de negrito através de um bloco <style> ou folha de estilos externa, usando valores de palavra-chave ou numéricos:
<style>
.emphasis {
font-weight: bold;
}
.light {
font-weight: 300;
}
.heavy {
font-weight: 900;
}
</style>
<p class="emphasis">Este texto está negrito (peso 700).</p>
<p class="light">Este texto é leve (peso 300).</p>
<p class="heavy">Este texto é extra pesado (peso 900).</p>
Note que a palavra-chave bold é equivalente ao valor numérico 700, e normal é equivalente a 400. Os valores numéricos dão-lhe controlo mais fino sobre o peso do texto, especialmente quando usar fontes variáveis ou famílias de fontes que oferecem múltiplas variações de peso.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.