O espessura da fonte propriedade em CSS é usada para definir o peso ou espessura da fonte. Ele especifica a espessura dos caracteres em um texto. O espessura da fonte A propriedade depende dos pesos especificados pelo navegador ou das faces de fonte disponíveis em uma família de fontes. Esta propriedade CSS define caracteres finos a grossos.

Ele aceita o valor numérico predefinido ou valores de palavras-chave. As palavras-chave disponíveis que podemos usar com esta propriedade são normal, negrito, mais claro e mais ousado . O valor numérico pode ser 100, 200, 300, ........., até 900. O valor numérico mais alto representa a espessura da fonte mais em negrito do que os valores numéricos mais baixos.

Sintaxe

 font-weight: normal | bold | bolder | lighter | number | initial | inherit; 

O número na sintaxe acima representa os valores numéricos. O valor numérico 400 é igual ao valor da palavra-chave normal , e o valor 700 é igual ao valor da palavra-chave audacioso .

O normal o valor forte> define os caracteres normais e o audacioso o valor especifica os caracteres grossos. O mais ousado valor representa a espessura da fonte mais ousada e o isqueiro o valor representa a espessura da fonte mais leve que a espessura herdada do pai.

Vamos ver como colocar texto em negrito em CSS usando uma ilustração.

Introdução

CSS é conhecido como uma ferramenta poderosa para o desenvolvimento da página web. Com a ajuda disso, podemos estilizar o conteúdo HTML de várias maneiras. Uma das propriedades mais comuns de estilo da página da web é usar a ajuda de uma propriedade font-weight. Com a ajuda do texto em negrito, podemos enfatizar as principais informações e o contraste visual, além de melhorar a legibilidade do conteúdo.

Compreendendo a propriedade Font-Weight

Em CSS, existe uma propriedade Font-Weight, que é usada para definir o peso ou espessura da fonte. Ele também determina o grau de negrito ou luminosidade do texto, aceitando o valor mais alto indicando uma espessura de fonte mais ousada. A propriedade font-weight aceita vários valores, como valores numéricos e de palavras-chave.

O intervalo de valores numéricos fica entre 100 e 900, com incrementos de 100. Por exemplo, se considerarmos o valor da espessura da fonte como 400, então é normal, enquanto um valor de espessura da fonte 700 é considerado em negrito. Negrito, mais ousado, mais claro e alguns valores de palavras-chave comumente usados.

Como criar texto em negrito com CSS

Podemos criar o texto em negrito em HTML com a ajuda de CSS. Podemos usar propriedades de estilo de fonte embutidas, internas ou externas.

1. Como podemos criar texto em negrito com estilo embutido

Com a ajuda do estilo embutido, podemos usar a propriedade font-weight diretamente em um elemento HTML específico. Vejamos um exemplo.

Código HTML:

 Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

Saída

Explicação:

No código acima, usamos o CSS inline e aplicamos a propriedade font-weight em negrito.

2. Como podemos criar texto em negrito com estilo interno

Aqui, temos que escrever a propriedade CSS dentro da tag head com a tag style. Vejamos um exemplo:

Código HTML:

 Document p { font-weight: bold; } <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

Saída

Explicação:

No código acima, usamos CSS interno e aplicamos a propriedade font-weight.

3. Como podemos criar texto em negrito com estilo externo

Aqui, temos que criar um arquivo CSS externo e vinculá-lo ao arquivo HTML. Dentro desse arquivo CSS, temos que escrever a propriedade style. Tomemos um exemplo.

Código HTML:

 Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

Código CSS:

 p { font-weight: bold; } 

Saída

Explicação:

No código acima, usamos a propriedade CSS externa e implementamos a propriedade font-weight.

Exemplo

Vamos ver como criar texto em negrito em diferentes tons usando o exemplo abaixo:

 p{ font-size: 20px; } <p>This font is normal.</p> <p>This font is bold.</p> <p>This font is lighter.</p> <p>This font is bolder.</p> <p>This font is 100 weight.</p> <p>This font is 200 weight.</p> <p>This font is 300 weight.</p> <p>This font is 400 weight.</p> <p>This font is 500 weight.</p> <p>This font is 600 weight.</p> <p>This font is 700 weight.</p> <p>This font is 800 weight.</p> <p>This font is 900 weight.</p> 

Saída

se mais, bash