Propriedade overflow do CSS
- Página anterior outline-width
- Próxima página overflow-anchor
Definição e uso
overflow
Define o que acontece quando o conteúdo excede a caixa do elemento.
Descrição
Esta propriedade define como o conteúdo da área de exibição do elemento de excesso será tratado. Se o valor for scroll, o agente de usuário fornecerá um mecanismo de rolagem, independentemente de ser necessário. Portanto, pode haver uma barra de rolagem mesmo que o conteúdo caiba na caixa do elemento.
Veja também:
Tutorial CSS:Posicionamento CSS
Manual de referência do HTML DOM:Propriedade overflow
Exemplo
Configurar a propriedade overflow:
div { width:150px; height:150px; overflow:scroll; }
Sintaxe do CSS
overflow: visible|hidden|clip|scroll|auto|initial|inherit;
Valor do atributo
Valor | Descrição |
---|---|
visible | Valor padrão. O conteúdo não será cortado e será exibido fora da caixa do elemento. |
hidden | O conteúdo será cortado e o restante do conteúdo não será visível. |
scroll | O conteúdo será cortado, mas o navegador exibirá a barra de rolagem para visualizar o restante do conteúdo. |
auto | Se o conteúdo for cortado, o navegador exibirá a barra de rolagem para visualizar o restante do conteúdo. |
inherit | Define que o valor da propriedade overflow deve ser herdado do elemento pai. |
Detalhes técnicos
Valor padrão: | visible |
---|---|
Herança: | não |
Versão: | CSS2 |
Sintaxe do JavaScript: | object.style.overflow="scroll" |
Mais exemplos
- Como usar a barra de rolagem para exibir o conteúdo que excede o elemento
- Este exemplo demonstra como configurar a propriedade overflow para definir a ação correspondente quando o conteúdo do elemento é maior que a área especificada.
- Como ocultar o conteúdo que excede o elemento
- Este exemplo demonstra como configurar a propriedade overflow para ocultar o conteúdo quando o conteúdo do elemento é太大以至于无法适应指定的区域。
- Como configurar o navegador para lidar automaticamente com o excesso de conteúdo
- Este exemplo demonstra como configurar o navegador para lidar automaticamente com o excesso de conteúdo.
Suporte do navegador
Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
- Página anterior outline-width
- Próxima página overflow-anchor