Planeta Tutorial
Planeta Tutorial

Ola Visitante, Seja bem vindo(a) ao Planeta Tutorial, esta-mos em construção em breve estaremos prontos para lhe atender e fornecer-lhe tutoriais e dicas diversas para você aprimorar os seus conhecimentos e passar para outros. esperamos que você goste de nosso conteudo e se torne um Membro para poder participar ainda mais de nossas atividades. Vale também ressaltar que, Para você ter acesso aos links por ai , é necessário ser registrado, então se registre .
Se já tem uma conta no forúm,
Logue-se .


Participe do fórum, é rápido e fácil

Planeta Tutorial
Planeta Tutorial

Ola Visitante, Seja bem vindo(a) ao Planeta Tutorial, esta-mos em construção em breve estaremos prontos para lhe atender e fornecer-lhe tutoriais e dicas diversas para você aprimorar os seus conhecimentos e passar para outros. esperamos que você goste de nosso conteudo e se torne um Membro para poder participar ainda mais de nossas atividades. Vale também ressaltar que, Para você ter acesso aos links por ai , é necessário ser registrado, então se registre .
Se já tem uma conta no forúm,
Logue-se .
Planeta Tutorial
Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.
Painel de Usuario

Mensagens: 0


Alterar
Ver
Tópicos e mensagens
Menu
Redes Sociais
Procurar
 
 

Resultados por:
 


Rechercher Pesquisa avançada

Translate
Últimos assuntos
» Regras da Área de pedidos
HTML códigos básicos Parte 2 EmptyTer 28 Jun 2011 - 17:31 por Admin

» Efeito Glow
HTML códigos básicos Parte 2 EmptySeg 27 Jun 2011 - 17:39 por Admin

» Efeito Brilho Suave nas fotos
HTML códigos básicos Parte 2 EmptySeg 27 Jun 2011 - 17:33 por Admin

» Arte geométrica com Photoshop
HTML códigos básicos Parte 2 EmptySeg 27 Jun 2011 - 17:31 por Admin

» Efeito Varinha Mágica no Photoshop
HTML códigos básicos Parte 2 EmptySáb 25 Jun 2011 - 15:20 por konan

» Montagem multicolorida com tintas e efeitos diversos
HTML códigos básicos Parte 2 EmptySáb 25 Jun 2011 - 15:18 por konan

» Linhas luminescentes no Photoshop
HTML códigos básicos Parte 2 EmptySáb 25 Jun 2011 - 15:17 por konan

» Segredos sobre design de site
HTML códigos básicos Parte 2 EmptySex 24 Jun 2011 - 23:00 por konan

» Hardware para iniciantes, parte 5
HTML códigos básicos Parte 2 EmptySex 24 Jun 2011 - 22:41 por konan

Estatísticas
Temos 26 usuários registrados
O último membro registrado é kaironborges

Os nossos membros postaram um total de 144 mensagens em 142 assuntos
Radio Jovem Pan
Relogio
março 2024
SegTerQuaQuiSexSábDom
    123
45678910
11121314151617
18192021222324
25262728293031

Calendário Calendário

Visitou

HTML códigos básicos Parte 2

Ir para baixo

HTML códigos básicos Parte 2 Empty HTML códigos básicos Parte 2

Mensagem por Admin Dom 12 Jun 2011 - 20:18

- Alinhamento de textos com a tag



Os parágrafos também podem ter atributos para o alinhamento dos textos. Basta apenas incluir depois do "P" o parâmetro "align=tipo de alinhamento". Os atributos são:

- Left: Alinhamento à esquerda
- Rigth: Alinhamento à direita
- Center: Centralizado
- Justify: Texto justificado (Só funciona em navegadores versão 4 ou superior)

Para incluir um destes atributos é simples. Veja os exemplos:


Texto alinhado à esquerda




Texto alinhado à direita




Texto centralizado




Texto justificado



Incluindo imagens

Agora que você já sabe incluir e formatar os textos de sua página, é possível que você queira dar mais vida à sua página, incluindo imagens e fundos nela.

Você faz as imagens em programas separados, em seu editor gráfico preferido. Ou pode usar imagens de outros sites. Mas os formatos ideais para home pages são GIF e JPG. Você não poderá usar o formato BMP.

A tag para inserir uma imagem em sua página é a seguinte:

Código:
<img src="nome do arquivo de imagem que vai aparecer">

Em "imagem que vai aparecer" você coloca o nome da imagem .gif ou .jpg ou o URL onde ela está para ser mostrada. Na verdade, apenas
Código:
<img src="nome do arquivo de imagem que vai aparecer">
já seria o suficiente, mas com o tempo você vai precisar usar os outros atributos.

- Atributos de Imagem

- Width e Height
São os atributos de largura e altura da imagem (Width: Largura da imagem - Height: Altura da imagem). Se você não incluí-los, não se preocupe. A imagem vai aparecer assim mesmo. Mas definindo os tamanhos da imagem ela carregará mais rápido.

Outra vantagem em usar o Width e Height é que você pode diminuir ou aumentar o tamanho de uma figura como você desejar, porém não recomendamos que você redimensione as imagens com esta opção. Se você quiser ter uma imagem menor, use um editor de imagem pra diminuir o tamanho dela, a imagem ficará mais bonita e também será mais leve para carregar. Se você tem uma página com galeria de imagens e uma "pré-vizualização" delas menores, sempre crie uma imagem menor com o editor de imagens, nunca use a imagem "maior" redimensionada, ela vai demorar muito a carregar e a vizualização não ficará boa.

- Alt
Texto alternativo. A função é apresentar um texto no lugar da imagem, enquanto esta ainda não apareceu.

- Border
Tamanho da borda da imagem. Os navegadores colocam uma borda na figura se este atributo estiver com um valor maior que zero. A vantagem é ocultar a borda que aparece e que indica que há um link em volta das figuras clicáveis. Muitas vezes esta borda faz a imagem ficar feia, quando o valor atribuído é zero. Veja um exemplo de imagem com borda igual a zero:

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Agora veja a mesma imagem com uma borda igual a 2:

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Uma tag de imagem com os atributos acima combinados ficaria assim:

Código:
<img src="nome do arquivo de imagem que vai aparecer alt="texto" border=0 width="largura da imagem" height="altura da imagem">

Um exemplo:
Código:
<img src="orbita.gif alt="Aqui aparece o texto alternativo" border=1 width="100" height="50">


O resultado é:

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]


- Dicas e Formato de Arquivos de imagem

- TAMANHO EM Kb:
Evite ao máximo colocar imagens maiores do que 30Kb em sua página pois, quanto mais arquivos tiver e quanto maiores eles forem, mais lenta será a transfência, não é bom ter imagens "pesadas" na página, isso só vai tornar o carregamento mais demorado e os visitantes podem acabar desistindo de esperar. Procure organizar e dividir as imagens em seu site de modo que ele não fique muito pesado, nem sempre agrada aos visitantes ter muitas imagens.

- PROGRAMAS:
É essencial que seja escolhido um bom programa de edição de imagens para que seu site tenha uma boa apresentação gráfica. Entre os mais usados estão o Corel Draw, Adobe Photoshop e Paint Shop Pro.

- O FORMATO GIF:
Formato dominante na Internet, o GIF é um tipo de arquivo gráfico relativamente compacto (quando comparado com o BMP por exemplo) e o GIF pode ser transparente, não transparente ou animado.

Um GIF transparente é aquele onde uma cor pode ser escolhida para ser transformada em transparente quando vista por um navegador e mostrar o que há embaixo. Os programas que são mais usados para criar gifs e permitem que se crie transparências são o Photoshop e o Fireworks.

Os GIFS animados são aqueles que têm movimento. Nada mais são que uma seqüência de GIFS previamente preparados. O criador do GIF animado, usando um programa como o GIF Animator, escolhe as imagens que formarão a seqüência que dará a idéia de movimento.

- O FORMATO JPEG (jpg):
Grandes fotos geralmente são salvas neste formato pois, nestes casos, se consegue reduzir bastante o tamanho em bytes da imagem, sem prejudicar sua qualidade. É aconselhável, antes de mandar um arquivo GIF grande para Web, testar como ficaria se salvo como JPG.

- O FORMATO BMP:
Esses bitmaps, apesar de muito utilizados no Windows, são muito pesados para a Web. Se quiser colocar alguma imagem que estiver neste formato, salve-a antes como GIF ou JPG usando um editor de imagens como o Paint Shop Pro, Photoshop ou FireWorks.
Admin
Admin
Fundador
Fundador

Respeito às regras : Respeito as regras 100%

Mensagens : 65
Reputação : 0
Data de inscrição : 31/05/2011

https://planetatutorial.forumeiros.com

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos