Scribd
Carregar
62 visualizações3 páginas

Exercícios HTML 2024

Eis aqui uma lista de exercícios para iniciantes em HTML

Enviado por

neliborgesmucavel
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd
62 visualizações3 páginas

Exercícios HTML 2024

Eis aqui uma lista de exercícios para iniciantes em HTML

Enviado por

neliborgesmucavel
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd
Você está na página 1/ 3

Está uma lista de 30 exercícios de HTML para praticar e melhorar suas habilidades:

1. **Criar um parágrafo**: Escreva um código HTML que exiba um parágrafo de texto simples.

2. **Inserir uma imagem**: Adicione uma imagem à página usando a tag `<img>` e o atributo `src`.

3. **Criar uma lista não ordenada**: Use a tag `<ul>` para criar uma lista não ordenada com alguns
itens.

4. **Criar uma lista ordenada**: Utilize a tag `<ol>` para criar uma lista ordenada com alguns itens
numerados.

5. **Criar um link para outra página**: Crie um link `<a>` que redirecione para outra página da web.

6. **Criar um link âncora**: Faça um link âncora que leve o usuário a uma seção específica da
mesma página usando o atributo `href`.

7. **Criar uma tabela simples**: Utilize as tags `<table>`, `<tr>`, `<td>` e `<th>` para criar uma tabela
com algumas linhas e colunas.

8. **Inserir um vídeo**: Adicione um vídeo à página usando a tag `<video>` e o atributo `src`.

9. **Inserir um áudio**: Inclua um arquivo de áudio na página usando a tag `<audio>` e o atributo
`src`.

10. **Estilizar texto com negrito e itálico**: Utilize as tags `<b>` e `<i>` para aplicar negrito e itálico a
partes do texto.

11. **Criar um formulário simples**: Crie um formulário básico usando as tags `<form>`, `<input>` e
`<button>`.
12. **Inserir um campo de texto**: Adicione um campo de texto usando `<input type=”text”>`
dentro de um formulário.

13. **Criar uma caixa de seleção**: Insira uma caixa de seleção (`<input type=”checkbox”>`) dentro
do formulário.

14. **Criar um botão de opção**: Adicione um botão de opção (`<input type=”radio”>`) dentro do
formulário.

15. **Criar um campo de texto para senha**: Utilize `<input type=”password”>` para criar um
campo de texto para senha dentro do formulário.

16. **Criar um campo de seleção**: Use a tag `<select>` e `<option>` para criar um menu suspenso
de seleção dentro do formulário.

17. **Inserir uma caixa de texto multilinha**: Adicione uma caixa de texto multilinha usando
`<textarea>` dentro do formulário.

18. **Criar um botão de envio**: Insira um botão de envio (`<input type=”submit”>`) dentro do
formulário.

19. **Criar uma caixa de texto de entrada de arquivo**: Use `<input type=”file”>` para permitir que
o usuário faça upload de um arquivo.

20. **Criar uma div com estilo CSS**: Crie uma `<div>` e estilize-a usando CSS interno ou externo.

21. **Usar estilos inline**: Aplique estilos diretamente a um elemento HTML usando o atributo
`style`.
22. **Criar uma lista de definição**: Utilize `<dl>`, `<dt>` e `<dd>` para criar uma lista de definição
com termos e suas definições.

23. **Inserir um mapa de imagem**: Adicione um mapa de imagem à página usando `<map>` e
`<area>`.

24. **Inserir uma linha horizontal**: Utilize `<hr>` para inserir uma linha horizontal na página.

25. **Inserir um comentário**: Adicione um comentário HTML que não será exibido na página
usando `<!-- -->`.

26. **Usar meta tags**: Inclua meta tags no cabeçalho (`<head>`) da página para definir
informações como charset, autor, descrição, etc.

27. **Usar tags semânticas**: Utilize tags semânticas como `<header>`, `<nav>`, `<section>`,
`<article>` e `<footer>` para estruturar o conteúdo da página.

28. **Criar um formulário de contato**: Crie um formulário de contato completo com campos como
nome, e-mail, mensagem, etc.

29. **Estilizar links com hover**: Aplique estilos diferentes a links quando o usuário passar o mouse
sobre eles usando `:hover` no CSS.

30. **Criar uma página com layout responsivo**: Desenvolva uma página que se ajuste bem em
dispositivos móveis usando media queries e elementos flexíveis.

Estes exercícios cobrem desde conceitos básicos até técnicas mais avançadas de HTML, ajudando a
praticar e aprofundar seus conhecimentos na criação de páginas web.

Você também pode gostar