Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Super_Zica_Man

Problema com DIV's

Por , em Desenvolvimento frontend

Recommended Posts

Super_Zica_Man    0

Super_Zica_Man
Postado

Estou começando agora e estudei o css,só que ficou uma grande duvida para montar o layout em css com divs.

 

Por exemplo:

 

Para criar um layout:

*800x600

*com um topo

*uma parte esquerda (onde irá ficar o menu)

*uma parte na direita (conteudo à ser definido)

*conteudo no centro

*rodapé em baixo

 

Isso tudo centralizado com um background-color para dar uma cor no fundo para quem usar a resolução 1024x768.

 

Tinha pensado assim:

 

(Arquivo .HTML)

 

*O #corpo que alinharia ele no centro e colocaria todas as outras div's dentro dele.

 

<html><head><style type="text/css"><!--@import url("arquivo.css");--></style></head><body><div id="corpo">		<div id="topo">	topo  </div>		<div id="menu">menu  </div>	<div id="conteudo">		conteudo  </div>	<div id="direita">direita  </div>	<div id="rodape">rodape  </div></div></body></html>

Está certo esse meu pensamento?

 

E como ficaria o css para ficar a estrutura certa?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovani    104

Giovani
Postado

Super_Zica_Man, você tá no caminho certo!!!

Olha só, aqui no fórum tem um material sobre isso, que explica bem direitinho como fazer uma layout como o seu.

 

Dê uma lida: Lab de Scripts WS

 

Além do layout com 3, também tem o com 2 colunas.

 

Se aparecer mais dúvidas, por favor, volte a postar!

 

[]'s http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

webflex    0

webflex
Postado

Olá,É isso ai amigo ;), qualquer coisa apite.Cumps \o/

Compartilhar este post

Link para o post
Compartilhar em outros sites

Super_Zica_Man    0

Super_Zica_Man
Postado

Problema com o layout resolvido. xDValeu gio! pelo link foi bastante util.Só me desculpe por não ter procurado no sub-fórum, pois, pensei que não teria nada de interessante lá.Preciso de uma opinião.Está aconselhado não usar o iframe para "carregar" a página com os conteudos?O que vocês acham de usar includes php com a parte de cima e outro com a parte de baixo do código? Assim teria que mudar apenas o conteudo para as paginas, e quando necessário alterar o topo ou menu...,etc teria que apenas mudar a pagina que está com o código de cima ou de baixo.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Hunter_    0

Hunter_
Postado

Se manjas de PHP, não conte pipoca meu caro trabalhe com includes facilita sua vida e muito!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas    4

Nícolas
Postado

Eu prefiro include com PHP sem dúvidas...

 

mas ao invez de se matar incluindo a parte de cima e de baixo... inclui só o conteudo.

 

 

 

index.php - http://www.site.com.br/?cont=pagina

<?

$cont = $_GET['cont'];

$cont .= ".php";

 

if(!file_exists($cont)){ $cont = "home.php"; }

 

?>

 

 

<html>

...

...

...

<body>

...

...

...

<div id="conteudo"><? include $cont; ?> </div>

...

...

..

</body>

</html>

Só você passar na url o nome do arquivo php com o conteudo...

 

home.php // inicial

http://www.site.com.br/

http://www.site.com.br/?cont=home

 

contato.php // contato

http://www.site.com.br/?cont=contato

 

etc....

 

 

Essa é uma forma simples de fazer a index como template...

 

Tem mil outras maneiras de fazer isso... usando switch e tal..

 

Outras lógicas...

 

 

 

 

Agora quanto a iframes... eu to usando iframes dependendo do caso... um que ficou legal foi esse site.

http://www.rarodoser.com.br/

obs: submenu de produtos ta zuado no firefox mas liga não... depois arrumo =]

 

 

Comecei a usar porque usei um jeito de fazer ele redimencionar de acordo com o conteudo.

http://forum.imasters.com.br/index.php?showtopic=214493

 

Porque nesse site em si é algo que ficaria interessante por causa do flash e tal

 

POREM... IFRAME NÃO É CONSIDERADO ACESSIVEL... E AINDA É CONSIDERADO ULTRAPASSADO...

 

Só não sei pq ele não é considerado acessivel sendo que com tabs você consegue chegar no conteudo interno... se alguem souber explicar agradeço...

 

 

Mas então...

 

Foi só uma dica... nas faz o jeito que mais te agrade...

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

Super_Zica_Man    0

Super_Zica_Man
Postado

mas ao invez de se matar incluindo a parte de cima e de baixo... inclui só o conteudo.index.php - http://www.site.com.br/?cont=paginaQUOTE<?$cont = $_GET['cont'];$cont .= ".php";if(!file_exists($cont)){ $cont = "home.php"; }?><html>.........<body>.........<div id="conteudo"><? include $cont; ?> </div>........</body></html>Só você passar na url o nome do arquivo php com o conteudo...home.php // inicialhttp://www.site.com.br/http://www.site.com.br/?cont=homecontato.php // contatohttp://www.site.com.br/?cont=contato

achei muito interessante isso, não manjo quase nada de php "só sei fazer os includes acho....";D como seria isso?crio uma pagina index.php com esse código no inicio ou dentro do head ou tanto faz? 
<?$cont = $_GET['cont'];$cont .= ".php";if(!file_exists($cont)){ $cont = "home.php"; }?>
dai o resto do código fica normal e só muda a div conteudo?dai quando for criar um link direciono para o www.site.com.br/?cont=nomedapaginaÉ assim?Obs:Muito boa a idéia acho que vai ser de grande ajuda

Compartilhar este post

Link para o post
Compartilhar em outros sites

Super_Zica_Man    0

Super_Zica_Man
Postado

Testei aqui no localhost e não deu certo.

 

Se tento abrir: http://localhost/index.php?cont=contato {abre a index mas sem conteudo no centro}

http://localhost/index.php/?cont=contato {não localiza a página}

 

Será que fiz algo de errado?

 

index.php

 

<?$cont = $_GET['cont'];$cont .= ".php";if(!file_exists($cont)){ $cont = "index.php"; }?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>E.E. DE ENSINO MÉDIO MONTE DAS TABOCAS - Venâncio Aires - RS</title><link href="style.css" rel="stylesheet" type="text/css" /><script type="text/javascript" src="drop_down.js"></script></head><body><div id="tudo">	<div id="topo"></div>		<div id="menu">		<ul id="nav">			<li><a href="#">Inicial</a></li>			<li><a href="#">A escola</a>				<ul>					<li><a href="#">Histórico</a></li>					<li><a href="#">Filosofia-Objetivos</a></li>					<li><a href="#">Proposta Pedagócica</a></li>					<li><a href="#">Categorias de Ensino</a></li>					<li><a href="#">Professores e Funcionários</a></li>				</ul>			</li>			<li><a href="#">Biblioteca</a></li>			<li><a  href="#">Laboratórios</a>				<ul>			<li><a href="#">Ciências</a></li>			<li><a href="#">Informática</a></li>				</ul>			<li><a href="#">Ginásio de Esportes</a></li>			<li><a href="#">Projetos</a>				<ul>					<li><a href="#">REDEmoinhos</a></li>					<li><a href="#">Comunitário-Rede GESAC</a></li>					<li><a href="#">Esportes</a></li>					<li><a href="#">Banda</a></li>					<li><a href="#">Monitoria</a></li>				</ul>			</li>			<li><a href="#">CPM-CE</a></li>			<li><a href="#">Grêmio Estudantil</a></li>			<li><a href="#">Eventos</a></li>			<li><a href="#">Notícias</a></li>			<li><a href="#">Atividades Complementares</a></li>			<li><a href="#">Galeria de Fotos</a></li>			<li><a href="#">Mensagem da Escola</a></li>			<li><a href="#">Fale Conosco</a></li>		</ul>	</div>		<div id="conteudo">		<? include $cont; ?> 	</div>	  <div id="noticias">		<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="120" height="270">					<param name="movie" value="http://www.iped.com.br/parceiros/publicidade/banner4.swf?url=http://www.iped.com.br/parceiros/campanha.php?15$2485$http://www.iped.com.br/i-img/logo_iped.gif">'>http://www.iped.com.br/parceiros/publicidade/banner4.swf?url=http://www.iped.com.br/parceiros/campanha.php?15$2485$http://www.iped.com.br/i-img/logo_iped.gif">					<param name="quality" value="high">					<embed src="http://www.iped.com.br/parceiros/publicidade/banner4.swf?url=http://www.iped.com.br/parceiros/campanha.php?15$2485$http://www.iped.com.br/i-img/logo_iped.gif" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="120" height="270">					</embed> 	</object>				  <br />				  <br />				<img src="../MT/FTP MT/arquivos/amigos_da_escola.jpg" width="120" height="144" border="1">	</div>		<div id="rodape">	  <p align="center"><br />			INICIAL | A ESCOLA | BIBLIOTECA | LABORATÓRIO DE CIÊNCIAS | LABORATÓRIO DE INFORMÁTICA | GINÁSIO | PROJETOS	 <br /> 			 CPM-CE | GRÊMIO ESTUDANTIL | EVENTOS | ATIVIDADES COMPLETARES	   | PARCERIAS | FALE CONOSCO		  </p>  </div></div></body></html>
contato.php

 

<h2>Título (1)</h2>		<p>In nibh odio, porttitor vel, mattis vel, porttitor eget, orci. Duis consectetuer tempus enim. Sed ut felis et tortor feugiat malesuada. Nam vulputate, tellus eu nonummy dapibus, pede risus luctus dolor, ut nonummy urna felis a lacus. Nam in dolor tincidunt ante vehicula dignissim. Nulla id libero ut dui placerat semper. Nulla sit amet nibh at velit facilisis gravida. Phasellus in diam. Pellentesque volutpat scelerisque dolor. Donec venenatis nulla suscipit nisl dignissim tristique. Ut ut lorem sit amet purus ullamcorper mattis. Phasellus ornare ligula non orci. Pellentesque luctus tristique orci. Proin a est. Nulla porta lacus ut leo. Nulla faucibus pede sit amet dui. Nullam aliquet lorem at nunc. Nullam eu tellus.</p>		<h2>Título (2)</h2>		<p>Sed tempus turpis vel quam molestie pulvinar. Suspendisse venenatis dolor semper ipsum. Quisque tempus erat ac mi. Aliquam semper, est nec hendrerit dignissim, ligula turpis sagittis purus, ut viverra velit eros at augue. Pellentesque mi nisi, porta eget, pharetra ac, sollicitudin sit amet, nisi. In sapien ligula lorem sollicitudin facilisis, sodales eget, tempus in, mauris. Cras risus sem, adipiscing non, convallis ac, consectetuer eu, dolor. In quam lorem ipsum dolor sit amet. Curabitur tempus aliquam nulla. Etiam eros.</p>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas    4

Nícolas
Postado

Teve um erro meu hehehe

 

troca o comecinho de

<?

$cont = $_GET['cont'];

$cont .= ".php";

 

if(!file_exists($cont)){ $cont = "index.php"; }

 

?>

para

 

<?

$cont = $_GET['cont'];

$cont .= ".php";

 

 

if(!file_exists($cont)){ $cont = "home.php"; }

 

?>

=)

 

 

Lembrando que tem servidores que dependendo da configuração do php.ini

 

Precia iniciar o script com...

 

<?php ao invez de <?

 

 

Qualquer coisa troca todas as tags <? por <?php

 

=]

 

 

Eu testei e aqui funcionou :D

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito