Multimídia: adicionando vídeos e áudio
Incorpore vídeos e arquivos de áudio à sua página web
Multimídia: adicionando vídeos e áudio é uma aula grátis de HTML for Kids no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de HTML for Kids, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de HTML for Kids inclui 4 aulas no total.
Estilos embutidos: adicionando uma estilização simples ao seu HTML
Boas-vindas ao mundo da estilização! Hoje, aprenderemos a usar estilos embutidos para alterar a aparência dos elementos da sua página da Web. Os estilos embutidos são uma forma simples e rápida de melhorar a aparência da sua página.
O que são estilos embutidos?
Os estilos embutidos permitem aplicar CSS (folhas de estilo em cascata) diretamente a um elemento HTML usando o atributo style.
Exemplo:
<h1 style="color: red;">Hello, World!</h1>
Isso exibirá um cabeçalho vermelho. Vamos explorar como funciona!
Alterando a cor do texto
Você pode alterar a cor do texto usando a propriedade color no atributo style.
Exemplo:
<p style="color: blue;">This is blue text.</p>
Alterando o tamanho da fonte
Para alterar o tamanho do texto, use a propriedade font-size.
Exemplo:
<p style="font-size: 20px;">This text is 20 pixels large.</p>Adicionando uma cor de fundo
Você pode adicionar uma cor de fundo a um elemento usando a propriedade background-color.
Exemplo:
<p style="background-color: yellow;">This text has a yellow background.</p>Combinando vários estilos
Você pode combinar vários estilos separando-os com um ponto e vírgula ;.
Exemplo:
<p style="color: white; background-color: black; font-size: 18px;">
This text has multiple styles applied!
</p>Estilizando outros elementos
Os estilos embutidos funcionam em todos os elementos HTML, como cabeçalhos, parágrafos e botões.
Exemplo:
<h1 style="color: green;">Styled Heading</h1>
<button style="background-color: lightblue; border: none; padding: 10px;">
Styled Button
</button>Experimente você mesmo
Vamos criar uma página da web com estilos incorporados. Veja um exemplo:
<!DOCTYPE html>
<html>
<head>
<title>Inline Styles Example</title>
</head>
<body>
<h1 style="color: purple;">Welcome to My Styled Page</h1>
<p style="color: gray; font-size: 16px;">
This paragraph has styled text.
</p>
<button style="background-color: coral; color: white; padding: 10px;">
Click Me!
</button>
</body>
</html>
Parabéns!
Parabéns! Você aprendeu a usar estilos incorporados para adicionar uma estilização simples e eficaz às suas páginas da web. Os estilos incorporados são uma ótima maneira de fazer alterações rápidas, mas há muito mais sobre estilização! Na próxima lição, exploraremos os conceitos básicos de CSS para liberar todo o potencial do design para a web. Prepare-se para criar páginas da web incríveis!
Perguntas Frequentes
A aula “Multimídia: adicionando vídeos e áudio” é grátis?
Sim — o texto completo de “Multimídia: adicionando vídeos e áudio” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de HTML for Kids, atualize para CoddyKit PRO. O curso de HTML for Kids inclui 4 aulas no total.
O que vou aprender em “Multimídia: adicionando vídeos e áudio”?
Incorpore vídeos e arquivos de áudio à sua página web Você pratica HTML for Kids com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar HTML for Kids?
Nenhuma experiência prévia é necessária. HTML for Kids no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.
Quanto tempo leva a aula “Multimídia: adicionando vídeos e áudio”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de HTML for Kids?
Sim. Cada aula de HTML for Kids inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- Tabelas: organizando dados
- Formulários: coletando dados do usuário
- Atributos do HTML
- Multimídia: adicionando vídeos e áudio