Trabalhando com Elementos Inline
Elementos inline permanecem em uma única linha e passam para a próxima linha quando o espaço acaba. Esse comportamento é controlado pela propriedade CSS display: inline.
Pontos principais sobre elementos inline:
- O padrão é
display: inline; - A largura e a altura são determinadas pelo conteúdo e não podem ser definidas explicitamente;
- Apenas propriedades horizontais como
padding,margineborderpodem ser aplicadas.
Vamos analisar um exemplo em que alguns estilos afetam o elemento, enquanto outros não, dentro do arquivo CSS:
index.html
index.css
Por padrão, elementos inline apresentam um espaço à direita; para elementos img, esse espaço aparece na parte inferior. Esse espaço não é atribuído ao padding ou margin. Em vez disso, trata-se de um espaço em branco inerente adicionado pelos navegadores para garantir uma distância entre cada elemento.
index.html
Obrigado pelo seu feedback!
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Can you explain why vertical margin and padding don't affect inline elements?
What are some examples of inline elements besides the <a> tag?
How can I make an inline element behave like a block element?
Awesome!
Completion rate improved to 2.56Trabalhando com Elementos Inline
Deslize para mostrar o menu
Elementos inline permanecem em uma única linha e passam para a próxima linha quando o espaço acaba. Esse comportamento é controlado pela propriedade CSS display: inline.
Pontos principais sobre elementos inline:
- O padrão é
display: inline; - A largura e a altura são determinadas pelo conteúdo e não podem ser definidas explicitamente;
- Apenas propriedades horizontais como
padding,margineborderpodem ser aplicadas.
Vamos analisar um exemplo em que alguns estilos afetam o elemento, enquanto outros não, dentro do arquivo CSS:
index.html
index.css
Por padrão, elementos inline apresentam um espaço à direita; para elementos img, esse espaço aparece na parte inferior. Esse espaço não é atribuído ao padding ou margin. Em vez disso, trata-se de um espaço em branco inerente adicionado pelos navegadores para garantir uma distância entre cada elemento.
index.html
Obrigado pelo seu feedback!
