Propriedades CSS Dimensão
As propriedades de dimensão CSS permitem controlar a altura e largura de um elemento.
Este elemento tem uma largura de 100%.
Definir altura e largura
Os height e width propriedades são usadas para definir a altura e largura de um elemento.
A height e width pode ser ajustada para automóvel (este é o padrão. Significa que o navegador calcula a altura e a largura), ou ser especificado em valores de comprimento, como px, cm , etc., ou em percentagem (%) do bloco contendo .
Nota: A height e width propriedades não incluem preenchimento, bordas, ou margens; eles definir a altura / largura da área dentro do espaçamento, borda e margem do elemento!
O exemplo a seguir mostra uma <div> elemento com uma altura de 100 pixels e uma largura de 500 pixels:
Definir max-width
O max-width propriedade é utilizada para definir a largura máxima de um elemento.
O max-width podem ser especificados em valores de comprimento, como px, cm , etc., ou em percentagem (%) do bloco que contém, ou definido como nenhum (este é padrão. Significa que não há largura máxima).
O problema com o <div> acima ocorre quando a janela de navegador é menor do que a largura do elemento (500 pixels). O navegador, em seguida, adiciona uma barra de rolagem horizontal para a página.
Usando max-width em vez disso, nesta situação, vai melhorar a movimentação do navegador de pequenas janelas.
Dica: Arraste a janela do navegador para menor do que 500px de largura, para ver a diferença entre as duas divs!
Nota: O valor do max-width sobreposições de propriedades de width .
O exemplo a seguir mostra uma <div> elemento com uma altura de 100 pixels e um max-width de 500 pixels:
Tente você mesmo - Exemplos
Definir a altura e largura de elementos
Este exemplo demonstra como definir a altura e largura de diferentes elementos.
Definir a altura e largura de uma imagem usando cento
Este exemplo demonstra como definir a altura e largura de uma imagem usando um valor de por cento.
Definir min-width e max-width de um elemento
Este exemplo demonstra como para definir uma largura mínima e uma largura máxima de um elemento com um valor de pixel.
Set min-height e max-altura de um elemento
Este exemplo demonstra como para definir uma altura mínima e uma altura máxima de um elemento com um valor de pixel.
Teste-se com exercícios!
Todas as propriedades CSS Dimensão
| Propriedade | Descrição |
|---|---|
| height | Define a altura de um elemento |
| max-height | Define a altura máxima de um elemento |
| max-width | Define a largura máxima de um elemento |
| min-height | Define a altura mínima de um elemento |
| min-width | Define a largura mínima de um elemento |
| width | Define a largura de um elemento |