4.13. Introdução ao HTML: estrutura básica, tags e atributos: Tabelas em HTML

Página 17

Introdução ao HTML: estrutura básica, tags e atributos: Tabelas em HTML

Introdução ao HTML: estrutura básica, tags e atributos: Tabelas em HTML

HTML, ou HyperText Markup Language, é a linguagem padrão para a criação de páginas e aplicações web. Composta por uma série de elementos, ou 'tags', o HTML forma a estrutura de uma página web e informa ao navegador como exibir o conteúdo. Nesta seção, vamos explorar a estrutura básica do HTML, as tags e os atributos, com um foco especial nas tabelas em HTML.

Estrutura Básica do HTML

Uma página HTML é composta por uma série de elementos aninhados. Cada página começa com a declaração do tipo de documento, que para HTML5 é simplesmente . A seguir, temos a tag html que envolve todo o conteúdo da página, seguida pelas tags head e body.

A tag head contém metadados sobre a página, como o título que aparece na aba do navegador, links para folhas de estilo CSS e scripts JavaScript. A tag body contém o conteúdo principal da página que é visível para os usuários.

Exemplo de Estrutura Básica do HTML

<!DOCTYPE html>
<html>
  <head>
    <title>Título da Página</title>
  </head>
  <body>
    Conteúdo da página vai aqui.
  </body>
</html>

Tags e Atributos do HTML

Os elementos HTML são definidos por tags. Uma tag é composta por um nome de elemento, cercado por sinais de menor e maior. A maioria dos elementos HTML tem uma tag de abertura e uma tag de fechamento, com o conteúdo do elemento no meio.

Por exemplo, para criar um parágrafo, usamos a tag p. A tag de abertura é <p> e a tag de fechamento é </p>. O conteúdo do parágrafo vai entre essas tags.

Além disso, as tags podem ter atributos, que fornecem informações adicionais sobre o elemento. Os atributos geralmente vêm em pares de nome/valor e são incluídos na tag de abertura do elemento.

Exemplo de Tags e Atributos do HTML

<p style="color:blue">Este é um parágrafo azul.</p>

Neste exemplo, style é um atributo da tag p, e "color:blue" é o valor do atributo. Isso informa ao navegador para exibir o texto do parágrafo em azul.

Tabelas em HTML

As tabelas em HTML são definidas com a tag <table>, e consistem em linhas e células. As linhas são definidas com a tag <tr>, e as células dentro das linhas são definidas com a tag <td> para as células de dados ou <th> para as células de cabeçalho.

Exemplo de Tabela em HTML

<table>
  <tr>
    <th>Cabeçalho 1</th>
    <th>Cabeçalho 2</th>
  </tr>
  <tr>
    <td>Célula 1</td>
    <td>Célula 2</td>
  </tr>
</table>

Este exemplo cria uma tabela com dois cabeçalhos e duas células de dados. O resultado é uma tabela com duas colunas e duas linhas.

As tabelas em HTML também podem ter atributos, como 'border' para definir a borda da tabela, 'width' e 'height' para definir a largura e a altura da tabela, e 'cellpadding' e 'cellspacing' para definir o espaço dentro e entre as células.

Exemplo de Tabela em HTML com Atributos

<table border="1" width="100%" cellpadding="5">
  <tr>
    <th>Cabeçalho 1</th>
    <th>Cabeçalho 2</th>
  </tr>
  <tr>
    <td>Célula 1</td>
    <td>Célula 2</td>
  </tr>
</table>

Este exemplo cria uma tabela com uma borda de 1 pixel, uma largura de 100% da largura da página, e um espaço interno de 5 pixels em cada célula.

Ahora responde el ejercicio sobre el contenido:

Qual é a função das tags 'table', 'tr' e 'td' no HTML?

¡Tienes razón! Felicitaciones, ahora pasa a la página siguiente.

¡Tú error! Inténtalo de nuevo.

Siguiente página del libro electrónico gratuito:

184.14. Introdução ao HTML: estrutura básica, tags e atributos: Tags de divisão e span

¡Obtén tu certificado para este curso gratis! descargando la aplicación Cursa y leyendo el libro electrónico allí. ¡Disponible en Google Play o App Store!

Disponible en Google Play Disponible en App Store

+ 6,5 millones
estudiantes

Certificado gratuito y
válido con código QR

48 mil ejercicios
gratis

Calificación de 4.8/5
en tiendas de aplicaciones

Cursos gratuitos de
vídeo, audio y texto.