Largura de tamanho automático com conteúdo de ajuste em CSS

O conteúdo de ajuste no CSS é usado para permitir que o texto ou a imagem se expandam ou encolhem de acordo com o tamanho da mudança de um texto ou imagem. Se o volume do conteúdo aumentar, as fronteiras ou largura também se expandem automaticamente e quando o volume do conteúdo diminui, as fronteiras ou a largura também diminuem automaticamente na saída.

Vamos discutir o funcionamento da declaração de conteúdo de ajuste e seu impacto nos resultados da saída com um código de amostra.

Largura de tamanho automático

A propriedade de largura do CSS é usada para dimensionar automaticamente a borda em um documento HTML e é escrito como:

Largura: conteúdo de ajuste;

Como usar a propriedade "Largura: Conteúdo do Fit" para automaticamente?

Deve haver uma classe em que o elemento para o qual o dimensionamento automático é necessário é criado. Por exemplo, existe uma classe "principal" contendo um texto que requer dimensionamento automático:

Parte html

Este é um documento para explicar a largura automática em HTML usando a propriedade CSS Fit-Content.

CSS parte | Propriedade CSS para tamanho automático

A propriedade CSS necessária para dimensionar automaticamente o texto adicionado na classe será:

.principal
margem: 30px 50px;
borda: 2px RGB sólido (12, 125, 139);
Largura: conteúdo de ajuste;

Aqui:

• Adicione um elemento de estilo e adicione uma propriedade de margem que definirá a largura e a altura onde a saída deve ser colocada na tela.
• Adicione a propriedade da fronteira declarando o peso da fronteira.
• E escreva a propriedade de largura como “Largura: Conteúdo do Fit”.

Isso criará a seguinte saída:

Alterando o volume de conteúdo

Agora, para ver como os size automático de conteúdo adequado dos elementos, vamos mudar (aumentar ou diminuir) o tamanho do conteúdo:

Este é um documento!

Ao alterar o conteúdo do contêiner Div, o tamanho da borda também mudará automaticamente:

Esta foi uma explicação clara de como usar a propriedade CSS de conteúdo de ajuste para largura de tamanho automático em um documento HTML.

Conclusão

Para usar o conteúdo do ajuste para o tamanho automático da largura, é necessário adicionar o “Largura: Conteúdo do ajuste”Propriedade no elemento de estilo, juntamente com outras propriedades de estilo, como margem e borda. Isso esticará a área e, portanto, as fronteiras automaticamente na saída se o texto aumentar em volume e diminuir a área se o volume do texto diminuir.