📄HTML
HTML é a linguagem para criar páginas web, estruturadas com tags como <html>, <head>, <title>, <body>, <b>, <i>, <p>, <h1>, <img>, <u>, <s>, e <marquee>. Elas organizam e formatam o conteúdo.
O que é?
HTML (HyperText Markup Language) é a linguagem usada para criar e estruturar páginas na web, semelhante a estrutura de uma casa. É importante que o arquivo termine com a extensão .html, pois isso indica ao navegador que o documento deve ser interpretado como uma página HTML. Utiliza tags para definir cada elemento da página, como títulos, parágrafos e imagens.
Estrutura Básica
<html>
<head>
<title>Olá, Mundo!</title>
</head>
<body>
Hello, World!
</body>
</html>A estrutura básica de uma página HTML começa com a declaração do tipo de documento e inclui três principais elementos (tags): <html>, <head>, e <body>.
<html>: A tag raiz que envolve todo o conteúdo da página. Ela é o contêiner principal e todos os elementos HTML devem estar dentro dela.
<head>: A seção
<head>contém metadados e informações de configuração que não são diretamente exibidas ao usuário. No exemplo, inclui:<title>: Define o título da página, que é exibido na aba do navegador. No exemplo, o título é "Olá, Mundo!".
<body>: A seção
<body>contém todo o conteúdo visível da página, como textos, imagens, links e outros elementos com os quais o usuário interage.
Essa estrutura fornece a base necessária para criar e organizar o conteúdo em uma página web, garantindo que tanto as informações visíveis quanto as invisíveis para o usuário estejam corretamente posicionadas e funcionem como esperado.
O que são tags?
As tags são como caixas que delimitam o conteúdo e são definidas por símbolos de menor que (<) e maior que (>). Por exemplo, a tag <h1> marca o início de um título e </h1> o encerra. É crucial abrir e fechar as tags corretamente, pois isso mantém a "construção" organizada. Se você abrir uma tag <div> e depois uma <p>, deve fechar primeiro o <p> com </p>, e depois o <div> com </div>. Isso mantém a estrutura organizada e clara, garantindo que a "casa" (página) esteja bem construída e funcione corretamente.
Em resumo, HTML é a base para construir e organizar o conteúdo na web, utilizando tags para definir o que cada parte do conteúdo representa.
Outras Tags
<b>: A tag
<b>é usada para aplicar negrito ao texto, destacando-o visualmente.<i>: A tag
<i>coloca o texto em itálico. Semanticamente, é usada para marcar um texto que deve ser diferenciado do texto normal, como termos técnicos, pensamentos ou nomes de obras.<p>: A tag
<p>representa um parágrafo, sendo a estrutura básica para blocos de texto. Ela cria uma separação lógica e visual entre diferentes seções de texto.<h1> a <h6>: Estas tags definem cabeçalhos, com
<h1>sendo o mais importante e<h6>o menos importante. Eles são usados para hierarquizar o conteúdo.. O<h1>geralmente é utilizado para o título principal da página, enquanto os outros (<h2>, <h3>, etc.) são usados para subtítulos e seções menores.<img>: A tag
<img>é usada para incorporar imagens na página. Ela requer o atributosrcpara especificar o caminho da imagem.<u>: A tag
<u>sublinha o texto. Pode ser utilizada para destacar nomes próprios ou outros textos especiais.<s>: A tag
<s>exibe o texto com uma linha no meio, indicando que o texto está incorreto ou foi removido. É frequentemente utilizada para mostrar correções ou mudanças de informação, como preços antigos em uma promoção.<marquee>: A tag
<marquee>faz o texto rolar na tela.<center>: A tag
<center>centraliza o conteúdo dentro dela. Embora ainda funcione, essa tag é obsoleta e não recomendada para uso em HTML moderno. Em vez disso, use CSS para centralização.<br>: A tag
<br>insere uma quebra de linha (line break). É útil para adicionar quebras de linha dentro de texto contínuo, sem iniciar um novo parágrafo.<pre>: A tag
<pre>é usada para definir texto pré-formatado. O texto dentro desta tag é exibido em uma fonte monoespaçado (como uma máquina de escrever), e os espaços em branco e quebras de linha são mantidos como estão.
Exemplo
<html>
<head>
<title>Exemplo de Tags HTML</title>
</head>
<body>
<h1>Exemplo de Página com Várias Tags HTML</h1>
<h2>Subtítulo Explicativo</h2>
<p>Este é um exemplo de parágrafo que utiliza várias tags HTML para demonstrar seu uso.</p>
<h3>Uso de <b>Negrito</b> e <i>Itálico</i></h3>
<p>A tag 'b' é usada para aplicar <b>negrito</b> ao texto, destacando-o visualmente.</p>
<p>A tag 'i' é usada para marcar texto em <i>itálico</i>, como termos técnicos ou pensamentos.</p>
<h4>Uso de <u>Sublinhado</u> e <s>Riscado</s></h4>
<p>Podemos <u>sublinhar</u> texto importante ou <s>mostrar que algo foi removido</s>.</p>
<p>Também podemos pular <br/>uma linha no texto de formas diferente.</p>
<pre>Essa tag respeita
exatamente
a
forma
como
colocou
o
texto.</pre>
<h5>Exemplo de Imagem Centralizada</h5>
<center><p>Abaixo está um exemplo de uma imagem incorporada:</p>
<img src="https://inspa.academy/logo1.png"/></center>
<h6>Texto Rolando</h6>
<marquee>Este é um exemplo de texto rolando com a tag.</marquee>
</body>
</html>Vídeos para Estudo
Atualizado
Isto foi útil?