Página Web que se auto-dimensiona

[camilawhite]

Boa noite,

Estou criando um site e gostaria de saber se tem alguma maneira fazer com que as páginas se auto-dimensionassem de acordo com a dimensão do monitor de quem está vendo. Estou usando para o desenvolvimento somente html e php, em algumas páginas.

Agradeço a todos pela atenção.

[DiF]

Olá, para isso.. basta você atribuir ao width um valor com %

exemplo:

você tem uma div id="tudo" que engloba todo seu site. e você quer que ele seja 70% de todo o monitor independente das polegadas... você faz no css:

#tudo{ width: 70%;}

só isso

abraço

[marcusnunes]

Só completando a resposta do dif...

Isso se chama layout fluido

[romano]

utilize o seguinte código css depois da tag </head>:

<style>

#body{width: 100% height: 100%};

</style>

cuidado ao utilizar layouts liquidos, pois se o usuário tiver um monitor de 400 x 200 px, é um exemplo, não haverá barra de rolagem e todo o conteudo do site ficará neste espaço sendo impossível ver algo. Muita gente usa celular para navegar, cuidado.

[camilawhite]

Muito Obrigada a todos pelas dicas, é mais ou menos isso mesmo que eu queria, vou continuar pesquisando. Estou construindo o site usando frames também e ai no frame onde chamo todo o conteúdo sempre fica a barra de rolagem e o site tem fundo preto então fica desagradável o layout. Gostaria de saber também se teria como tirá-la.

[DiF]

sugiro que nunca faça seus sites usando frames... pois a W3C ja considera obsoletos, conforme os padrões da webstandard.

use divs.

[camilawhite]

Ok, mas em um site que tenha um menu muito extenso, criá-lo em todas as páginas não é muito viável, o frame resolve este problema e ainda se quer adicionar itens nesse menu tem que fazer isso em todas as páginas. Tem uma forma de colocar o conteúdo "padrão" na div no CSS, por exemplo?

[DiF]

tem, se você usar php.. você cria um arquivo menu.inc.php

nele vai toda a estrutura (x)html do seu menu, aquelas tags <UL> <LI>

você faz uma vez só... tudo que você queira.

então no seu site você coloca um include' menu.inc.php'; com isso.. você so precisa chamar ele nas paginas. toda a alteraçao que fizer no menu.. vai automaticamente mudar em todas.

outro metodo é você usar o SSI, consiste em você criar seu site... todo o layout.. menus.. e no lugar do conteudo na parte principal.. você coloca um pequeno script php.. que faz uma serie de IF e Else para verificaçoes.. e inclusoes de paginas. com isso você cria um layout estático, e o que muda é só a parte do conteudo. com isso você so teria o trabalho de criar mini paginas só contendo o conteudo.. e suas formataçoes em específico e inclui-las na parte principal. isso é melhor do que usar frames. alias.. é a mesma coisa mas a diferença é que a W3C ainda nao considera a tecnica de SSI obsoleta.

[camilawhite]

Entendi, são métodos bem legais e práticos também.

Sou nova nessa e não tenho muito conhecimento nessas técnicas ;/

Muito obrigada pelas dicas.

[DiF]

estude elas, você verá q sera muito util... pricipalmente.. quando você quiser deixar coisas estaticas que precise mudar para varias paginas.. convem usar o include.

[camilawhite]

Vou estudar sim, me pareceram bem vantajosas já que em um site que fiz como trabalho da escola, utilizei somente divs e o menu era muito extenso e tinha que ser atualizado em todas as páginas, que eram muitas, gastou muito tempo ;/

Por isso agora estava usando frames no outro projeto. Mas vou trocá-lo pra as includes.

Mais uma vez, obrigada.

[DiF]

certo. o include é bem vantajoso. você so precisa criar uma div onde o menu irá ficar.. e chamar assim:

<?php include 'menu.inc.php'; ?>

apenas isso. quando você mudar alguma coisa... no arquivo menu.inc.php mudará automaticamente para todas as paginas que você tem o include.

[camilawhite]

Entendi e no arquivo 'menu.inc.php' é só fazer o menu normal, como eu faria se estivesse construindo direto na div?

[DiF]

sim, faz normal mesmo. você tem só o nome menu.inc.php mas seu conteudo pode ser apenas uma div com as tags do UL, LI como você fosse fazer normalmente na div la na sua pagina. ate porque.. se você tiver usando o Firefox, faça desse jeito como te disse.. e de um CTRL + U, para visualizar o código fonte. verá que mesmo você tendo colocado o menu em um arquivo separado.. vai constar como se você tivesse colocado junto. isso se dá pela funçao do include que nada mais é do que uma inclusão, uma agregação de uma parte do código.. em outras palavras, o include integra ao seu código uma parte do codigo, paginas.. e qualquer outro arquivo que necessite. nao sei se foi bem claro.. qualquer coisa posta ai.

vou dar um exemplo bem básico de estrura e o que acontece quando usa include.

bom considere a seguinte estrutura:

HTML

<html>
 <head>
      <title> teste</title>
 </head>
<body>

[COLOR="Red"]<div id="menuLateral">
   <?php include 'menu.inc.php'; ?>
 </div>[/COLOR]
</body>
</html>

menu.inc.php:

<div id="menuConteudo">
  <ul>
      <li>Link 1</li>
      <li>Link 2</li>
      <li>Link 3</li>
      <li>Link 4</li>
  </ul> 
</div>

agora como ficaria no código fonte da pagina usando o CTRL + U no Firefox para visualizar:

<html>
 <head>
      <title> teste</title>
 </head>
<body>

<div id="menuLateral">
  [COLOR="Red"] <div id="menuConteudo">
       <ul>
           <li>Link 1</li>
           <li>Link 2</li>
           <li>Link 3</li>
           <li>Link 4</li>
      </ul> 
    </div>[/COLOR]
 </div>
</body>
</html>

o que ta em vermelho foi incluido com a funçao include

abraço

[camilawhite]

A sim, entendi, é só criar normal mesmo.

Muito obrigada pela ajuda.

[Linio Alan]

Caso o autor do tópico necessite, o mesmo será reaberto, para isso deverá entrar em contato com a moderação solicitando o desbloqueio.