Você está em: Principal › Tutoriais › Informatizando sua Empresa com Excel : Htmlbasico002
Html Básico. Parte 2
O objetivo deste tutorial é continuar aprendendo a linguagem html básica, vamos aprender os comandos para alinhamento de textos.
Para você poder acompanhar o desenvolvimento deste tutorial, será necessário ter conhecimento no mínimo do
de informática básica e Parte 1 do tutorial html básico.
Vamos começar criando uma página na qual daremos o nome de index.html, inserir nesta página uma pequena frase de minha autoria para que possamos fazer as alterações quanto ao alinhamento do texto, sendo que vou ensinar os seguintes posicionamento básicos:
Alinhamento do texto a esquerda;
Alinhamento do texto centralizado;
Alinhamento do texto a direita;
Alinhamento do texto justificado.
Copie abaixo a página, cole dentro do bloco de notas e salve a mesma com nome que definimos dentro da pasta site que deve se encontrar na area de trabalho do seu computador.
<title>Alinhamento de texto</title>
Nunca desista do seu sonho, lute por ele sempre que algum dia você irá realiza-lo e se nessa vida não conseguir fazer tudo faça tudo aquilo que pode.
Veja como deve ficar esta página através da tela abaixo:
Para colocar o texto alinhado a esquerda utilizamos a seguinte tag:
<p align="Left"> * Aqui você insere o texto </p>
Para colocar o texto centralizado no meio da página utilize a seguinte tag:
<p align="center"> *Aqui voce insere o texto </center>
Para colocar o texto a direita utilize a seguinte tag:
<p align="Right"> * Aqui você insere o texto </center> </p>
<p align="Justify"> *Aqui você insere o texto </center>
Veja no texto acima que esta alinhado a esquerda, mas igual vamos colocar ele entre cada uma das tags para podermos observar o seu posicionamento, veja estes procedimentos através das telas baixos.
Primeiro vamos ver como fica o texto alinhado a esquerda, para isso através da página index.html abra o código fonte e depois coloque a tag <p align="left"></P> de maneira que o texto fique no meio e salve.
Tela 002 (Selcionado o código fonte)
Tela 003 (Texto entre a tag de alinhamento a esquerda)
Tela 004 (Note que o texto quase não se altera porque mas o mesmo esta com a formatação de alinhamento a esquerda)
Para as demais formatações o processo é o mesmo que acabamos de fazer, ou seja, para o próximo alinhamento que será o centralizado, você pode apenas subistituir o nome "left" por "center" e assim para as demais tags, por isso vou mostrar apenas como deve ficar as telas com o alinhamento do texto.
- Alinhamento centralizado.
Tela 005 (Note o texto centralizado)
- Alinhado a direita
Tela 006 (Texto a direita)
- Texto Justificado, nesta formatação irei mostrar em duas telas a primeira eu aumentei o texto e deixei alinha a direita, na segunda tela eu coloquei o texto justificado para que você possa notar a diferênça.
Tela 008 (Note que a palavra "nunca" no canto direito ficou com mais espaço para a direita, assim com a frase ficou mais espaços entre as palavras)
Ensinei as formatações básicas para texto, com a utilização da tag <p align=""></p> , expliquei a função de cada tag desenvolve de uma forma bem prática e objetiva, mostrei através das telas para que você tenha uma melhor compreensão, na próxima parte iremos aprender a formatar o texto. Até a próxima parte.