Designers Fórum > Colocar O Site Centralizado

Full Version: Colocar O Site Centralizado

Designers Fórum > Desenvolvimento > Ajax, CSS, Javascript e Html

piterr

Jun 1 2008, 05:58 PM

Aeww pessoal, eu jogo em um time aki de onde eu moro
ai eu quis fazer um site pro time, eu fiz em flash. Ai na hora que eu coloquei no ar
os site fico maneiro mas teve um problema, ele fico no quanto esquerdo, como eu centralizo ele no flash para qualquer resolução de monitor???

Site: http://www.bvfc.vai.la/

Aguardo Respostas!!!

Designers Fórum

РŘ!ΜØ™

Jun 1 2008, 06:37 PM

Primeiro de tudo é eliminar os frames. Site em flash não necessita de frames. Usa html normal.
Depois você pode colocar swf dentro de um "div" com atributos de css:

#seu_div {
width: 100%;
height: 100%;
text-align: center;
margin: auto;
position: relative;
}

piterr

Jun 1 2008, 07:05 PM

Mas tipow, eu to começando nesse ramo agora, como que eu faço para eliminar os Frames e como que eu coloco o swf dentro "div", onde fica o div???

Aguardo Respostas!!!

РŘ!ΜØ™

Jun 1 2008, 07:59 PM

Desculpa aí sobre o comentário do frame... Esse frame foi adicionado ao seu site pelo seu provedor de hospedagem.

Quanto ao div, seu código fonte é esse, já acrescidas as tag div:

<div id="layout"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="755" height="410" id="index" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="index.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#990000" /><embed src="index.swf" quality="high" bgcolor="#990000" width="755" height="410" name="index" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object></div>
</body>
</html>

Note que a div tem um atributo "id". Este atributo identifica o css da div. O css é que determina o posicionamento e vários outros atributos, no seu caso, coloque dentro do seu código, entre as tags <head></head>:

CODE

Ou então usa uma tabela:

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="text-align:center">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" name="index" width="755" height="410" align="middle" id="index">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="index.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#990000" />
<embed src="index.swf" quality="high" bgcolor="#990000" width="755" height="410" name="index" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</td>
</tr>
</table>

piterr

Jun 1 2008, 08:10 PM

Mas tipoww, eu não sei onde colocar esse codigo, por exemplo
se fosse no dreamweraver lá tem um botão chamado Code, e no flash
onde eu vo coloca esse codigo ai???

Aguardo Respostas!!!

meu msn piter-r@hotmail.com

:::HS:::

Jun 1 2008, 09:31 PM

Olá,

não tenho bem a certeza mas acho que depois de teres tudo feito em flash, vais ter de passar para tudo para o dreamweaver e la centralizas tudo

Bom trabalho

piterr

Jun 3 2008, 04:46 PM

Obrigadoo aeww

consegui resolver o problema...
eu abri o index com DreamWeaver e consegui centralizar
vlw aeww pela ajudaa.

Abraçoss!!!

GSaraiva

Jun 5 2008, 07:31 PM

Só pra não ficar faltando a resposta:

Se declarar DOCTYPE, o documento não se ajusta com o height igual ao da janela,
então se você escrever uma linha de texto, seu < HTML > vai ter o Height de uma linha de texto, pra esse caso você deve utilizar o CSS:

CODE

<DOCTYPE ....>
<html>
<head>
<style type="text/css">
html, body { height: 100% }
</style>
</head>
<body>
<table width="100%" height="100%">
<tr><td align="center" valign="middle">
MEIO
</td></tr>
</table>
</body>
</html>

O pulo do gato é só o HTML e o Body serem forçados a ajustar-se ao tamanho da janela.

Pra organizar e reduzir o custo de declaração no código, vale o código abaixo:

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
html, body { height: 100% }
.Page { width: 100%; height: 100%}
.Page tr td { text-align: center; vertical-align: middle }
</style>
</head>
<body>
<table class="Page"><tr><td>
MEIO
</td></tr></table>
</body>
</html>

text-align = alinhamento horizontal dos objetos
vertical-align = alinhamento vertical dos objetos

Abraços

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.