Foros del Web - Ver Mensaje Individual

baccxus · #4 (**permalink**) 25/06/2005, 16:34

Hola Luisa, como estuve desocupado hoy, me dió por rehacer tu diseño, espero no lo tomes a mal.

Como consejo, te diría que es mejor que uses CSS en vez de tablas (tan) anidadas, además que programes lo que son fuentes, tamaños, colores y todo lo demás en CSS, si supieras cuanto tiempo se ahorra. te posteo el código de cómo sería tu página en CSS y espero que lo estudies, lo que no comprendas, sólo pregúntalo.

Código HTML:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
body,td,th {font-family: Verdana, Helvetica, sans-serif; font-size: 12px;}
body {background-color: #8B99A8; margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px;}
a:link {color: #8B99A8; text-decoration: none}
a:visited { color: #8B99A8; text-decoration: none}
a:hover { color: #000000; text-decoration: none}
#menu {position:relative; float:left; background-color:#FFF; width:110px; padding: 0px 24px; height: 960px;}
#menu a { display:block; text-align:left; line-height: 18px;}
#menu p {line-height: 48px;}
#header {position:relative; width: 703px; height:112px;}
#cuerpo {position:relative; clear:both; padding: 24px 0px 0px 0px; width: 703px}
#contenido {position:relative; float:right; background-color:#FFF; width:537px; height: 936px; padding-top: 24px}
.izquierda {width: 45%; height: 160px; float: left; position:relative;}
.derecha {width: 45%; height: 160px; float: right; position:relative;}
.derecha p, .izquierda p { padding: 12px; line-height: 24px;}
#info {position:relative; height:49px; text-align:center; font-size:x-small; color:#000; width: 703px; clear:both; padding: 25px 0px 0px 0px}
-->
</style>
</head>

<body>
<center><div id="header"><img src="Imageshome/home1.jpg" alt="" width="92" height="112"/><img src="Imageshome/home2.jpg" alt="" width="66" height="112"/><img src="Imageshome/home3.jpg" alt="" width="7" height="112"/><img src="Imageshome/home4.jpg" alt="" width="71" height="112"/><img src="Imageshome/home5.jpg" alt="" width="73" height="112"/><img src="Imageshome/home6.jpg" alt="" width="170" height="112"/><img src="Imageshome/home7.jpg" alt="" width="224" height="112"/></div>
<div id="cuerpo">
<div id="menu">
<p>Men&uacute;</p>
<a href="index.html">Home</a> <a href="galeriaimagenes.htm">Galer&iacute;a</a><a href="dibujosmanuales.htm">Dibujos</a> <a href="fotografias.htm">Fotograf&iacute;as</a>
<p>Utilidades</p>
<a href="descargas.htm">Descargas</a><a href="tutoriales.htm">Tutoriales</a><a href="links.htm">Links</a>
<p>Contacto</p>
<a href="profile.htm">Con&oacute;ceme</a><a href="correo.htm">Correo e-mail</a>
<p>Publicidad</p>
</div>
<div id="contenido">
<div class="izquierda">
<p><img src="imagenes/walla.jpg" width="112" height="85" /><br />
DiskMan</p>
<p><img src="imagenes/tasa.jpg" width="112" height="85" /><br />
Taza de T&eacute; </p>
<p><img src="imagenes/gioconda.jpg" width="112" height="85" /><br />
Gioconda</p>
<p><img src="imagenes/monari.jpg" width="112" height="85" /><br />
Coctel de Frutas </p>
<p><img src="imagenes/canaria.jpg" width="112" height="85" /><br />
Canarias</p>
<p><img src="imagenes/postalcanarias.jpg" width="112" height="85" /><br />
Postal Canaria 2 </p>
</div>
<div class="derecha">
<p><img src="imagenes/anuncio.jpg" width="112" height="85" /><br />
Xyclone</p>
<p><img src="imagenes/postal.jpg" width="112" height="85" /><br />
Bola Navidad </p>
<p> <img src="imagenes/cartel.jpg" width="112" height="85" /><br />
Cartel</p>
<p><img src="imagenes/casa.jpg" width="112" height="85" /><br />
Casa Vectorial </p>
<p><img src="imagenes/postalcanaria.jpg" width="112" height="85" /><br />
Postal Canaria</p>
<p><img src="imagenes/postalcanariass.jpg" width="112" height="85" /><br />
Postal Canaria 3 </p>
</div>
</div>
</div>
<div id="info">Copyright ArteyGr&aacute;fica.com &copy; 2004 - 2005</div>
</center></body>
</html>

un saludo

PD:La página en tablas era de 17kb, y con css, sólo me tomo 4kb