Pues estoy empezando a aprender html y css y me he encontrado con ésta traba que no e como resolver.
El tema es que la imagen no me sale ni por activa ni por pasiva os paso los codigos y me decis si podeis... gracias de antemano amigos :).
CODIGO HTML
CODIGO CSS
Ya se que hay cosas que no pintan nada como por ejemplo poner el font-family en todos lados pero es por unos cambios que hice xDDD
El tema es que la imagen no me sale ni por activa ni por pasiva os paso los codigos y me decis si podeis... gracias de antemano amigos :).
CODIGO 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=utf-8" />
<title> Probando divs </title>
<link href="estilos.css" rel="stylesheet" type="text/css" media="all" />
</head>
<body>
<div id="dimensiones">
<div id="curva-superior"></div>
<div id="cabecera">Bienvenidos a mi Web</div>
<div id="navigation">
<ul>
<li><a href="#">BOTON1</li>
<li><a href="#">BOTON2</a></li>
<li><a href="#">BOTON3</a></li>
<li><a href="#">BOTON4</a></li>
<li><a href="#">BOTON5</a></li>
<li><a href="#">BOTON6</a></li>
<li><a href="#">BOTON7</a></li>
<li><a href="#">BOTON8</a></li>
</ul>
</div>
<div id="contenido">
<div id="articles">Articulos</div>
<div id="noticias"><h1>Título de la noticia</h1>
<p>Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.</p>
<p>Y este es el tercer párrafo. En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.
Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.</p></div>
<div class="modulo">módulo
<ul >
<li><a href="#">BOTON 1</a></li>
<li><a href="#">BOTON 2</a></li>
<li><a href="#">BOTON 3</a></li>
<li><a href="#">BOTON 4</a></li>
<li><a href="#">BOTON 5</a></li>
<li><a href="#">BOTON 6</a></li>
</ul>
</div>
<p>Esta será la zona principal de la web</p>
</div>
<div id="pie">Este es el pié de página</div>
</div>
</body>
</html>CODIGO CSS
* {margin:0px; padding:0px; border:0px; font-family:verdana; }
#dimensiones {width:1024px; margin:4px auto;}
body {text-align:center; font-size:14px;}
h1 { font-size:20px; font-style:bold; margin:10px 40px 10px 40px; text-align:left; }
#cabecera {background-color: pink; height:180px;}
#navigation { background-color:gray; height:40px; width:1024px; font-size:14px; font-style:bold; font-family:verdana; padding-top:20px; }
#navigation ul li { margin:30px 30px 10px 30px; }
#navigation ul li { display:inline; width:1024; }
#curva-superior { background-image:url(/objetos/curva-superior.gif)
background-repeat:no-repeat; width:800px; height:12px; overflow:hidden; }
#contenido {background-color:orange; height:800px;}
#pie {background-color:brown;}
#articles {background-color:red; width:1024px; height:180px; float:top;}
.modulo {background-color:yellow; width:250px; height:300px; float:right;}
.modulo li { list-style:none; text-align:center; }
#noticias {background-color:green; width:774px; height:300px; float:left;}
#noticias p { margin:10px 40px 10px 40px; text-indent:50px; }
a {
color:#0CF;
text-decoration:none;
display:inline;
}
a:link {}
a:visited {}
a:hover { color:red; text-decoration:underline; background-color: silver; }
a:active {}
p {text-align:justify; font-size:14px; font-family:verdana; }Ya se que hay cosas que no pintan nada como por ejemplo poner el font-family en todos lados pero es por unos cambios que hice xDDD