Foros del Web » Creando para Internet » Diseño web »

wenas , me falta un div por colocar que nose como poner

Estas en el tema de wenas , me falta un div por colocar que nose como poner en el foro de Diseño web en Foros del Web. s , tengo que terminar un trabajo de clase , y lo tengo casi todo echo ,solo me falta introducir un borde solo que nose ...
  #1 (permalink)  
Antiguo 29/10/2011, 09:40
Avatar de Txerrinko  
Fecha de Ingreso: abril-2010
Ubicación: Vitoria-Gasteiz, Pais Vasco, Spain, Spain
Mensajes: 45
Antigüedad: 14 años
Puntos: 0
Pregunta wenas , me falta un div por colocar que nose como poner

s , tengo que terminar un trabajo de clase , y lo tengo casi todo echo ,solo me falta introducir un borde solo que nose como introducirlo para que no se me desestructure toda la página , aver si pudieran echarme un cable

la forma de la pagina tiene que ser esta





me faltan por poner los bordes azul y el borde rojo en la página , como lo hago??



Os dejo aquí el HTML y el css

Código HTML:
<?xml version="1.0" encoding="UTF-8"?>
<!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" xml:lang="en" lang="en">
	<head>
		<link rel="stylesheet" type="text/css" href="piripi2.css">
		<title>El Ingenioso Hidalgo Don Quijote de la Mancha</title>
	</head>
	<body>
	<div id="capitulos"> 
		<p>Cap�tulos</p>
	    <ul>
	  <li> <a href="#capitulo1"> Capitulo I  <a> </li>	
	 <li> <a href="#capitulo2"> Capitulo II  <a> </li>	
	 <li> <a href="#capitulo3"> Capitulo III <a> </li>	
	 <li> <a href="#capitulo4"> Capitulo IV  <a> </li>	
	 <li> <a href="#capitulo5"> Capitulo V  <a> </li>	
	  
	   <ul>
	</div>
	
		<div id="final"> <p> El ingenioso  Hidalgo Don Quijote de la Mancha  </div>
		
		
		<div id="contenido">
			<h1>El ingenioso hidalgo Don Quijote de la Mancha</h1>
			
				<h2>Cap�tulo Primero</h2>
				<p class="subtitular">Que trata de la condici�n y ejercicio del famoso hidalgo D. Quijote de la Mancha</p>
				<p><img src="imagenes/dore01.jpg" />En un lugar de la Mancha, de cuyo nombre no quiero acordarme, no ha mucho tiempo que viv�a un hidalgo de los de lanza en astillero, adarga antigua, roc�n flaco y galgo corredor. Una olla de algo m�s vaca que carnero, salpic�n las m�s noches, duelos y quebrantos los s�bados, lentejas los viernes, alg�n palomino de a�adidura los domingos, consum�an las tres partes de su hacienda. El resto della conclu�an sayo de velarte, calzas de velludo para las fiestas con sus pantuflos de lo mismo, los d�as de entre semana se honraba con su vellori de lo m�s fino. Ten�a en su casa una ama que pasaba de los cuarenta, y una sobrina que no llegaba a los veinte, y un mozo de campo y plaza, que as� ensillaba el roc�n como tomaba la podadera. Frisaba la edad de nuestro hidalgo con los cincuenta a�os, era de complexi�n recia, seco de carnes, enjuto de rostro; gran madrugador y amigo </p>

</body>
</html> 
Código:
body{
background-image:url(imagenes/fondo.gif);

font:antiqua;
}
#contenido{
	margin-left:200px;
	margin-bottom:50px;
	
}
p.margen{
    margin-left:15px;
}

p.subtitular{
   border:2px solid #000080;
   padding-bottom:20px;
}   
#subtitular{
    border:2px solid #000080;
   padding-bottom:20px;
   }

#capitulos{
position:fixed;
list-style-image:url(imagenes/bolaroja.png);


}
#ul li {
margin:0px;
padding:0px;

}

#texto{
margin:150pt;
margin-top:0pt;
margin-right:0pt;

}

#nombrecapitulo{
border:2py solid #0033CC;
font-family:Arial,Helvetica;
font-size:20px;
padding-bottom:10px;



}
#final{
position:fixed;
bottom:0pt;
width:100%;
text-align:center;
background-color:yellow ;
font-size:20px;
font-family:Arial,Helvetica;
border:1pt solid #0000FF;
background-color:#FFFF00;
}

PD:aún estoy de principiante con esto , así que perdonenme si les parece muy básico el problema...
  #2 (permalink)  
Antiguo 30/10/2011, 10:48
 
Fecha de Ingreso: octubre-2011
Mensajes: 1
Antigüedad: 12 años, 6 meses
Puntos: 1
Respuesta: wenas , me falta un div por colocar que nose como poner

Bueno, ya he resuelto tu problema, cómo todavia estás estudiando es normal que no te salgan las cosas a la primera, por éso no te preocupes

Varias cosas, tienes que saber que una etiqueta <div> puede ir dentro de otra etiqueta <div> y así hasta el infinito;
Código HTML:
Ver original
  1. <div>
  2.         <div>
  3.           </div>
  4. </div>

pero tiene que asegurarte de cerrar todas las etiquetas interiores, por que tu <div id="capitulos"> no cerraba correctamente al tú no haber cerrado la lista desordenada <ul>

lo único que he hecho ha sido crear un <div> para contener el parrafo y la imagen y usar el css para darle un border. Cómo es una página pequeña puedes usar ids únicos para cada div pero es mejor usar class="". E aquí el código:

HTML
Código HTML:
Ver original
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  5.     <head>
  6.         <link rel="stylesheet" type="text/css" href="piripi2.css">
  7.         <title>El Ingenioso Hidalgo Don Quijote de la Mancha</title>
  8.     </head>
  9.     <body>
  10.     <div id="capitulos">
  11.         <p>Cap&iacute;tulos</p>
  12.         <ul>
  13.       <li> <a href="#capitulo1"> Capitulo I  <a> </li> 
  14.      <li> <a href="#capitulo2"> Capitulo II  <a> </li> 
  15.      <li> <a href="#capitulo3"> Capitulo III <a> </li> 
  16.      <li> <a href="#capitulo4"> Capitulo IV  <a> </li> 
  17.      <li> <a href="#capitulo5"> Capitulo V  <a> </li>  
  18.      
  19.        </ul>
  20.     </div>
  21.    
  22.         <div id="final"> <p> El ingenioso  Hidalgo Don Quijote de la Mancha  </div>
  23.        
  24.        
  25.         <div id="contenido">
  26.             <h1>El ingenioso hidalgo Don Quijote de la Mancha</h1>
  27.            
  28.                 <h2>Cap&iacute;tulo Primero</h2>
  29.                 <p class="subtitular">Que trata de la condici&oacute;n y ejercicio del famoso hidalgo D. Quijote de la Mancha</p>
  30.                 <div id="cap1"><p><img src="dore01.jpg" />En un lugar de la Mancha, de cuyo nombre no quiero acordarme, no ha mucho tiempo que viv?a un hidalgo de los de lanza en astillero, adarga antigua, roc?n flaco y galgo corredor. Una olla de algo m?s vaca que carnero, salpic?n las m?s noches, duelos y quebrantos los s?bados, lentejas los viernes, alg?n palomino de a?adidura los domingos, consum?an las tres partes de su hacienda. El resto della conclu?an sayo de velarte, calzas de velludo para las fiestas con sus pantuflos de lo mismo, los d?as de entre semana se honraba con su vellori de lo m?s fino. Ten?a en su casa una ama que pasaba de los cuarenta, y una sobrina que no llegaba a los veinte, y un mozo de campo y plaza, que as? ensillaba el roc?n como tomaba la podadera. Frisaba la edad de nuestro hidalgo con los cincuenta a&ntilde;os, era de complexi&oacute;n recia, seco de carnes, enjuto de rostro; gran madrugador y amigo </p></div>
  31. </div>
  32. </body>
  33. </html>

CSS
Código CSS:
Ver original
  1. body{
  2. background-image:url(imagenes/fondo.gif);
  3.  
  4. font:antiqua;
  5. }
  6. #contenido{
  7.     margin-left:200px;
  8.     margin-bottom:50px;
  9.    
  10. }
  11. #cap1 {
  12.     border:solid;
  13.     border-color:#F00;
  14.     }
  15. p.margen{
  16.     margin-left:15px;
  17. }
  18.  
  19. p.subtitular{
  20.    border:2px solid #000080;
  21.    padding-bottom:20px;
  22. }  
  23. #subtitular{
  24.     border:2px solid #000080;
  25.    padding-bottom:20px;
  26.    }
  27.  
  28. #capitulos{
  29. position:fixed;
  30. list-style-image:url(imagenes/bolaroja.png);
  31.  
  32.  
  33. }
  34. #ul li {
  35. margin:0px;
  36. padding:0px;
  37.  
  38. }
  39.  
  40. #texto{
  41. margin:150pt;
  42. margin-top:0pt;
  43. margin-right:0pt;
  44.  
  45. }
  46.  
  47. #nombrecapitulo{
  48. border:2py solid #0033CC;
  49. font-family:Arial,Helvetica;
  50. font-size:20px;
  51. padding-bottom:10px;
  52.  
  53.  
  54.  
  55. }
  56. #final{
  57. position:fixed;
  58. bottom:0pt;
  59. width:100%;
  60. text-align:center;
  61. background-color:yellow ;
  62. font-size:20px;
  63. font-family:Arial,Helvetica;
  64. border:1pt solid #0000FF;
  65. background-color:#FFFF00;
  66. }
  #3 (permalink)  
Antiguo 31/10/2011, 10:06
Avatar de Txerrinko  
Fecha de Ingreso: abril-2010
Ubicación: Vitoria-Gasteiz, Pais Vasco, Spain, Spain
Mensajes: 45
Antigüedad: 14 años
Puntos: 0
Respuesta: wenas , me falta un div por colocar que nose como poner

muchas gracias!!! +1 =)

Etiquetas: bordes, css, html
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:20.