Como criar um layout de largura fixa com CSS

Como criar um layout de largura fixa com CSS
O "layout fixo”Também é referido como um layout estático e é medido em“píxeis”. Este tipo de layout torna a largura do elemento fixo. Além disso, o layout fixo é programado de uma maneira que, independentemente do tamanho ou resolução da tela, a largura do elemento não mudará. É benéfico para usuários que desejam apresentar imagens corporativas consistentes a todos os visitantes.

Este blog demonstrará o procedimento de criação de um layout de largura fixa com CSS.

Como criar um layout de largura fixa usando CSS?

Com o objetivo de criar um layout de largura fixa, primeiro, dentro do elemento corporal do HTML, adicione um elemento div com um nome de classe “Largura fixa”. Então, adicione

e

elementos para adicionar algum conteúdo.

Html


Bem -vindo ao Linuxhint


Linuxhint é o melhor site de tutorial online. Se você quiser aprender a programação do Bash, você está no lugar certo.


A estrutura de marcação foi concluída e pode ser vista na imagem abaixo:

Agora, vamos aplicar propriedades de estilo CSS aos elementos HTML acima.

Estilo todos os elementos

*
margem: 0px;
preenchimento: 0px;

Como sabemos, os layouts de largura fixa usam largura de pixel exata, então, a propriedade de largura será definida em “píxeis”. Ele define que a largura do elemento permanecerá a mesma que em cada tamanho de tela.

Divis de largura fixa de estilo

.Largura fixa
Background-Color: RGB (238, 238, 238);
margem: automático;
MAX-LUDA: 400PX;
Altura: 100VH;

O ".Largura fixa”Está se referindo à largura fixa da classe div. As seguintes propriedades são aplicadas à largura fixa da div:

  • ““cor de fundo”Especifica a cor do fundo do elemento.
  • ““margem”Especifica o espaço ao redor do elemento.
  • ““largura máxima”Define a largura máxima do elemento.
  • ““altura”Propriedade define a altura do elemento.

A saída do código mencionado é exibido abaixo:

Pode-se observar que a largura da largura fixa div é fixa. Não muda de acordo com os tamanhos da tela.

É assim que o layout de largura fixa é criada no CSS.

Conclusão

Os layouts de largura fixa definem a largura do elemento fixo. Eles permanecem os mesmos em cada tamanho de tela. Se a largura da janela do navegador for menor que a largura do layout, uma barra de rolagem horizontal aparecerá e a largura do elemento não mudará. Para consertar o layout, a largura do elemento deve ser especificada em “píxeis”. Com a ajuda de um exemplo prático, este blog demonstrou como criar um layout de largura fixa no CSS.