Maquetacion a dos Columnas con CSS



Maquetar una Pagina Web con CSS

Codigo Fuente:


<html>
<head>
<style type="text/css">
BODY {
font: 8pt Verdana, Geneva, Arial, Helvetica, sans-serif;
margin: 10 0 10 0px;
text-align: center;
background-color:#FFFFCC
}
#contenedor{
text-align: left;
margin: auto;
width: 770px;
}
#cabecera{
background-color:#B5E089;
color: #333300;
font-size:12pt;
font-weight: bold;
padding: 3 3 3 10px;
}
#cuerpo{
margin: 10 0 10 0px;
}
#lateral{
width: 160px;
background-color:#C5CFF5;
float:right;
}
#lateral ul{
margin : 0 0 0 0px;
padding: 0 0 0 0px;
list-style: none;
}
#lateral li{
background-color:#D98AA8;
margin: 2 2 2 2px;
padding: 2 2 2 2px;
font-weight: bold;
}
#lateral a{
color: #3333cc;
text-decoration: none;
}
#principal{
background-color:#F2EFC6
padding: 4 4 4 4px;
margin-right: 170px;
font-size:12px
}
#pie{
clear: both;
background-color:#408080;
padding: 3 10 3 10px;
text-align:right;
}
</style>
</head>
<body>
<div id="contenedor">
<div id="cabecera">
Trinisoft Blog de Tecnologias y Programacion
</div>
<div id="cuerpo">
<div id="lateral">
<ul>
<li><a href="#">CSS</a>
<li><a href="#">AJAX</a>
<li><a href="#">DTHML</a>
<li><a href="#">XHTML</a>
<li><a href="#">LINUX</a>
<li><a href="#">ADOBE</a>
</ul>
</div>
<div id="principal">
Trinisoft, nace de la idea de mi docente de estructuras de datos con la intencion de dar a conocer a sus estudiantes las nuevas tecnologias web.
<br>
<br>
la intencion de este blog es de recoloectar informacion para aquellas personas que no tienen abceso a los costosos libros de manera que puedan mediante ejemplos conocer a cerca de la variedad de tecnologias que existen.
<br>
<br>
este blog poco a poco con la ayuda de todas la personas que me apoyan estaremos publicando mucho material acerca de programacion diseno web estructuras de datos en fin de todo un poco.
Nuestro objetivo es recolectar la mayor cantidad materiales didácticos para los que se inician en la materia y los que ya estan en ella, dirigidos a diversos sectores educativos y de formacion academica, presentando diferentes propuestas, con un nivel de nivel medio para arriba.
<br>
<br>
Trinisoft tiene como visión llegar a ser reconocidos a nivel internacional como un blog que contribuye a la mejora del nivel educativo academico.
Año tras año se trabaja intensamente para ofrecer, tanto al docente como alumno una serie de manuales para respaldar y fortalecer sus conocimientos con publicaciones de elevada calidad didáctica siempre recolectados cuidadosamente por mi persona y algunos amigos especializados en cada área, para ofrecer materiales acordes a la exigencias de la nueva tecnología del mercado educativo.
<br>
<br>
Como siempre estamos abiertos a vuestras sugerencias y agradeceremos cualquier iniciativa que sirva para mejorar nuestro trabajo</div>
</div>
<div id="pie">
&copy; 20011 trinisoft.blogspot.com
</div>
</div>
</body>
</html>

Comentarios