Etiqueta HTML <body>

Definição e uso

<body> A tag define o corpo do documento.

Os metadados e informações do documento do HTML estão envoltos no elemento head, enquanto o conteúdo do documento está envolto no elemento body.

O elemento body sempre segue o elemento head, sendo o segundo filho do elemento html.

<body> O elemento contém todo o conteúdo do documento HTML, por exemplo, títulos, parágrafos, imagens, links, tabelas, listas, etc.

Atenção:Um documento HTML pode ter apenas um <body> Elemento.

Exemplo

Um documento HTML simples mas completo:

<!DOCTYPE html>
<html>
  <head>
    <title>Título do documento</title>
  </head>
  <body>
    <h1>Este é um título</h1>
    <p>Este é um parágrafo.</p>
  </body>
</html>

Experimente você mesmo

Dica:Mais exemplos estão disponíveis na parte inferior da página.

Atributos globais

<body> A tag também suporta Atributos globais no HTML.

Atributos de evento

<body> A tag também suporta Atributos de evento no HTML.

Configurações CSS padrão

A maioria dos navegadores usará os seguintes valores padrão para exibir <body> Elemento:

body {
  exibição: bloco;
  margem: 8px;
}
body:focus {
  contorno: nenhum;
}

Experimente você mesmo

Mais exemplos

Exemplo 1

Adicione uma imagem de fundo ao documento (usando CSS):

<html>
<head>
<style>
body {
  imagem-de-fundo: url(w3s.png);
}
</style>
</head>
<body>
<h1>Hello world!</h1>
<p><a href="">Acesse codew3c.com!</a></p>
</body>

Experimente você mesmo

Exemplo 2

Defina a cor de fundo do documento (usando CSS):

<html>
<head>
<style>
body {
  cor-de-fundo: #E6E6FA;
}
</style>
</head>
<body>
<h1>Hello world!</h1>
<p><a href="https://www.codew3c.com">Acesse codew3c.com!</a></p>
</body>

Experimente você mesmo

Exemplo 3

Defina a cor do texto do documento (usando CSS):

<html>
<head>
<style>
body {
  cor: verde;
}
</style>
</head>
<body>
<h1>Hello world!</h1>
<p>Este é um texto.</p>
<p><a href="">Acesse codew3c.com!</a></p>
</body>
</html>

Experimente você mesmo

Exemplo 4

Definir a cor dos links não visitados no documento (usando CSS):

<html>
<head>
<style>
a:link {
  cor:#0000FF;
}
</style>
</head>
<body>
<p><a href="https://www.codew3c.com">codew3c.com</a></p>
<p><a href="https://www.codew3c.com/html/">Tutorial HTML</a></p>
</body>
</html>

Experimente você mesmo

Exemplo 5

Definir a cor dos links ativos no documento (usando CSS):

<html>
<head>
<style>
a:active {
  cor:#00FF00;
}
</style>
</head>
<body>
<p><a href="https://www.codew3c.com">codew3c.com</a></p>
<p><a href="https://www.codew3c.com/html/">Tutorial HTML</a></p>
</body>
</html>

Experimente você mesmo

Exemplo 6

Definir a cor dos links visitados no documento (usando CSS):

<html>
<head>
<style>
a:visited {
  cor:#FF0000;
}
</style>
</head>
<body>
<p><a href="https://www.codew3c.com">codew3c.com</a></p>
<p><a href="https://www.codew3c.com/html/">Tutorial HTML</a></p>
</body>
</html>

Experimente você mesmo

Suporte de navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte