Como utilizar os atributos da etiqueta <p> - Dezegner

Já vimos a estrutura de um documento com a etiqueta <p>, agora vamos ver seus Atributos. 

Como na etiqueta <h>, a etiqueta <p> tem seus atributos de alinhamento e estilos.


Temos quatro tipos de alinhamentos:

center
Alinhamento centralizado.

left
Alinhamento à esquerda.

right
Alinhamento à direita.

justify
Alinhamento justificado. 
Nota-se que a etiqueta <h> não usa esse tipo de alinhamento.  

Veja na estrutura:

<html>
<head>
<title>Título da sua página</title>
</head>
<body>
<p align="center">Centralizado</p>
<P align="left">À esquerda </p>
<P align="right">À direita </P>
<P align="Justify">justificado</p>
</body>
</html>

Ficaria assim no seu navegador:








style
Agora vamos ver o atributo Style e seus valores:  

color
Define a cor da fonte do texto.

font-family
Define  qual tipo de fonte  pode ser usada.

font-size
Define o tamanho  da fonte utilizada (em pontos exemplo, font-size:”20pt”).

Vamos ver na estrutura como fica:

<html>
<head>
<title> Título da sua página</title>
</head>
<body>
<p align="center" Style="color: gold; font-family: arial, sans-serif; font-size:20pt"> Centralizado</p> 
<p align="left" Style="color: red; font-family: arial, helveltica, sans-serif; font-size:10pt >À esquerda</p> 
<p align="right" Style="color: red; font-family: arial, helveltica, sans-serif; font-size:14pt >À direita</p> 
<p align="Justify" Style="color:black; font-family: arial, helveltica, sans-serif; font-size:24pt >justificado</p>
</body>
</hml>

No navegador fica assim:


Nota se que, no atributo font-family, usamos vários nomes de fontes, isso para que o navegador a encontre no seu computador ao abrir a página. 

Caso o navegador não encontre o tipo de fonte especificado (pelo fato de não ter ela no seu computador), ele substitui pela próxima fonte definida na tag. 

Você pode baixar, e instalar uma fonte nova ou que você não tenha no seu computador.

Mas isso vamos ver numa outra postagem, ok.
Bem, por enquanto é só.
A seguir vamos ver formatando textos.

Nenhum comentário:

Postar um comentário

Marcadores

etiqueta (29) tutorial (18) meta (16) html (15) a (10) link (10) formatar texto (3) VETOR (2) body (2) caracteres (2) id (2) p (2) vídeo (2) âncora (2) Photoshop (1) address (1) blink (1) blockquote (1) br (1) center (1) div (1) e-mail (1) font (1) frameset (1) h (1) head (1) pre (1) title (1)

paginador numerico