HTML Tutorial

Se você usa um processador de texto, deve estar familiarizado com a capacidade de colocar o texto em negrito, itálico ou sublinhado; essas são apenas três das dez opções disponíveis para indicar como o texto pode aparecer em HTML e XHTML.

Texto em negrito:
Qualquer coisa que apareça dentro do elemento <b> … </b> é exibida em negrito conforme mostrado abaixo:

See the Pen
HTML – Exemplo de texto em negrito by John Pires (@johnpiresBR)
on CodePen.

Texto Itálico:



Qualquer coisa que apareça dentro do elemento <i> … </i> é exibida em itálico conforme mostrado abaixo:

See the Pen
HTML – Exemplo de texto em itálico by John Pires (@johnpiresBR)
on CodePen.

Texto Sublinhado:



Qualquer coisa que apareça dentro do elemento <u> … </u>, é exibido com sublinhado conforme mostrado abaixo:

See the Pen
HTML – Texto sublinhado by John Pires (@johnpiresBR)
on CodePen.

Strike Text:



Qualquer coisa que apareça dentro do elemento <strike> … </strike> é exibido com tachado, que é uma linha fina através do texto, conforme mostrado abaixo:

See the Pen
HTML – Texto em rascunho by John Pires (@johnpiresBR)
on CodePen.

Fonte monoespaçada:



O conteúdo de um elemento <tt> … </tt> é escrito em fonte monoespaçada. A maioria das fontes são conhecidas como fontes de largura variável porque letras diferentes têm larguras diferentes (por exemplo, a letra ‘m’ é mais larga do que a letra ‘i’). Em uma fonte monoespaçada, no entanto, cada letra tem a mesma largura.

See the Pen
HTML – Fonte Monoespaçada by John Pires (@johnpiresBR)
on CodePen.

Texto sobrescrito:



O conteúdo de um elemento ^… é escrito em sobrescrito; o tamanho da fonte usado é o mesmo dos caracteres ao seu redor, mas é mostrado a metade da altura do caractere acima.

See the Pen
HTML – Texto sobrescrito by John Pires (@johnpiresBR)
on CodePen.

Texto Subscrito



O conteúdo de um elemento _… é escrito em subscrito; o tamanho da fonte usado é o mesmo dos caracteres ao seu redor, mas é exibido a metade da altura de um caractere abaixo dos outros caracteres.

See the Pen
HTML – Texto subscrito by John Pires (@johnpiresBR)
on CodePen.

Texto Inserido:



Tudo o que aparece dentro do elemento <ins> … </ins> é exibido como texto inserido.

See the Pen
HTML – Texto inserido by John Pires (@johnpiresBR)
on CodePen.

Texto Excluído:



Tudo o que aparece no elemento <del> … </del> é exibido como texto excluído.

See the Pen
HTML – Texto excluído by John Pires (@johnpiresBR)
on CodePen.

Texto Maior:



O conteúdo do elemento <big> … </big> é exibido com um tamanho de fonte maior do que o resto do texto ao seu redor, conforme mostrado abaixo:

See the Pen
HTML – Texto Maior by John Pires (@johnpiresBR)
on CodePen.

Texto Menor:



O conteúdo do elemento <small> … </small> é exibido com um tamanho de fonte menor do que o resto do texto ao seu redor, conforme mostrado abaixo:

See the Pen
HTML – Texto Menor by John Pires (@johnpiresBR)
on CodePen.

Agrupando Conteúdo:



Os elementos <div> e <span> permitem que você agrupe vários elementos para criar seções ou subseções de uma página.

Por exemplo, você pode querer colocar todas as notas de rodapé em uma página dentro de um elemento <div> para indicar que todos os elementos dentro desse elemento <div> estão relacionados às notas de rodapé. Você pode então anexar um estilo a este elemento <div> para que apareçam usando um conjunto especial de regras de estilo.

See the Pen
HTML – Agrupando Conteudo by John Pires (@johnpiresBR)
on CodePen.