Veja este tutorial de HTML que mostra como trabalhar com parágrafos usando a tag p, título da página usando h1 e subtítulos com as tags do h2 ao h6.
Títulos, subtítulos e parágrafos em HTML são elementos extremamente comuns em quase todos os sites. O bom uso deste elementos de textos podem trazer resultados positivos para a navegação no site e a apresentação dos seu documento HTML. As tags p (parágrafo), h1(título) e h2 ao h6 (subtítulos) serão analisadas aqui.
Parágrafos em HTML – Tag p
A tag p é usada para fazer a estruturação de textos em parágrafos dentro de um documento HTML. A princípio todos os textos deverão estar dentro desta tag, exceto:
Quando o texto for um título, nesta nova condição deverá ser usado as tags <h1> a <h6>.
Quando o texto for uma citação, neste caso use a tag <blockquote>.
Quando o texto for uma lista de marcadores ou lista, neste caso use <ul> e <li> ou <ol> e <li>.
Quando for uma legenda, neste caso use <legend>
Atributos
A tag p suporta os seguintes atributos:
class – Permite a associação de uma classe de formatação de CSS
id – Cria um identificador para o parágrafo. Útil para fazer formatações personalizadas.
style – Cria uma formatação de CSS Inline.
Exemplo de um documento com três parágrafos, cada um usando um dos atributos acima:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Estruturação de parágrafos com a tag p</title>
</head>
<body>
<p class="texto">Parágrafo com uma classe associada</p>
<p id="destaque">Parágrafo com um identificador</p>
<p style="color:#ff0000">Parágrafo com formatação de CSS inline</p>
</body>
</html>
Eventos
A tag p suporta ainda os eventos: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown e onkeyup.
Tag h1 – Título da página em HTML
A tag H1 é usada para determinar o título da página. Conceitualmente existem 6 níveis de títulos, sendo o h1 o mais alto de todos, ou seja, ele deve ser usado para indicar o texto mais importante da página.
Exemplo:
<h1>Título do texto da sua página</h1>
Considerações
O comportamento padrão do H1 é negrito e tamanho da fonte xx
Cada página deverá ter apenas uma tag h1, já que presupõe que cada página tenha um único título
Por ser uma tag de texto, ela aceita formatação por CSS das propriedades de fonte, bloco de textos, background, box model, posicionamento, borda e layout.
Deve ser poscionada no início do texto. Não faz sentido usar esta tag no meio do texto
Tags h2 ao h6 – subtítulos da página
A tag h2 a h6 complementam a lista das tags usadas para títulos. Como estas tags são classificadas por níveis é correto afirmar que o h2 deve ser usado em um texto mais importante que o texto do h3 e assim por diante.
Não é necessário fazer o uso de todos os 6 níveis, exceto quando o texto for classificado em muitas seções, exigindo assim uma documentação muito rígida. Normalmente usa-se o h1, h2 e h3 para a maioria dos textos encontrados na web.
Exemplo:
<h2>Título do texto nível 2</h2>
<h3>Título do texto nível 3</h3>
<h2>Título do texto nível 4</h2>
<h5>Título do texto nível 5</h5>
<h6>Título do texto nível 6</h6>
Considerações
O comportamento padrão das tags h2 a h6 é negrito e o tamanho da fonte varia de acordo com o nível, sendo o h2 tamanho maior e h6 tamanho menor
Essas tags poderão ser usadas mais de uma vez na página, mas sem excesso
Por ser uma tag de texto, ela aceita formatação por CSS das propriedades de fonte, bloco de textos, background, box model, posicionamento, borda e layout.
Não faz sentido usar o h3 sem termos usado o h2, conceitualmente só iremos usar h3 depois de termos usado o h1 e o h2
Nenhum comentário:
Postar um comentário