HTML RESUMO

Página 1

Página 2

HTML

Linguagem de marcação de hipertexto

É o bloco de construção mais básico da web

Define o significado e a estrutura do conteúdo da web. Resposável por textos, imagens...

.html

Hipertexto se refere aos hiperlinks que conectam as páginas. Linguagem de marcação pq ele trabalha com tags, rótulos.

<> </> elemento htlm

Atualmente existem cerca de 140 tags, algumas já em desuso

Muitas são intuitivas até em pt <img> <video> <audio>

Mas todas em eng <il> <ul>

Criar projeto no C: pq lá fica independente do usuário

VSCODE

Fechar pasta = File, close folder

index.html padrão

ALT + Z QUEBRA DE LINHA

Abrir pasta no vscode pelo cmd

CMD CD CAMINHO ENTER

CODE .

TAGS

<!DOCTYPE HTML>

<HTML></HTML>

<HEAD>

<TITLE> titulo do site </title>

</head>

<body>

<p> </p>

HTML : 5 MONTA A ESTRUTURA BÁSICA

meta charset = UTF-8

lan=pt-br

viewport elementos vão se adaptar a area visivel da tela

Deixa uma sinopse do site para quando mandar o link <meta name= "description" content="..."

<meta name="keywords" content=<"palavras chaves">

<meta name="author" content="taís França"

TAGS DE CABEÇALHO

Começam com h de head

<h1></h1>

Os hs servem pra mostrar para o navegador a importancia daquilo dentro do texto

<p> Lorem texto para encher

O texto é hierarquico, só pode ter um h1, o restante deve ser h2, mais de h1 confunde os buscadores

p*3 abre 3 paragrafos

TAGS DE FORMATAÇÃO DE TEXTO

Negrito = <b></b> bold <strong></..> não tem sintaxe

o resultado visual é mesmo mas o navegador interpreta o b e não o strong

<hr> linha nãp tem fechamento

<br></br> break rool quebra linha

<u> underline

<small></small> deixa pequeno

<del></del> risca

 superior

 inferior

<mark></> marca texto

ELEMENTOS DE CITAÇÃO

Quando passa o mouse mostra o significago da sigla<abbr title = "hyper text..."></abb>

<address> rua ..... </address>

<cite>nome de uma obra filme, livro...</>

citação direta <q></> ele coloca as aspas

<blockquote> </>texto destacado

<bdo></> inverte a direção do texto

<!--comentarios-->

p*3>lorem

crtl + kc

LINKS

caminho absoluto

<a href="https://google.com" target="_blank"> ir para o site</a>

caminho relativo

<a href="xxx.html"> Voltar para a principal</a>

IMAGENS

<img src"aminho">