Tema: Me ayudan con mi pagina
Ver Mensaje Individual
  #5 (permalink)  
Antiguo 14/09/2011, 18:36
Avatar de hackjose
hackjose
 
Fecha de Ingreso: abril-2010
Ubicación: Edo Mexico
Mensajes: 1.178
Antigüedad: 14 años
Puntos: 131
Respuesta: Me ayudan con mi pagina
mmm y no tienes algo de PHP que pueda hacer? algo asi como un trueke o cuanto me cobras

Te muestro el codigo que se ajusto a lo que necesito

Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <head>
  4. <title>Programacion Geek</title>
  5. <link href="style.css" rel="stylesheet" />
  6. </head>
  7.  
  8. <body>
  9.  
  10. <header>
  11. <div id="cabeza">
  12.     <h1 class="clase_fuente">Programacion Geek</h1>
  13.     <nav>
  14.     <div id="botonera">
  15.         <div id="boton1" class="clase_fuente">Inicio</div>
  16.         <div id="boton2" class="clase_fuente">HTML 5</div>
  17.         <div id="boton3" class="clase_fuente">PHP</div>
  18.         <div id="boton4" class="clase_fuente">ASP.NET</div>
  19.         <div id="boton5" class="clase_fuente">Contacto</div>
  20.     </div>
  21.     </nav>
  22. </div>
  23. </header>
  24.  
  25. <div id="contenido">
  26.     <div id="articulo">
  27.     <h2 class="clase_fuente">Crear pagina web con Ruby on Rails</h2><br />
  28.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  29.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  30.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  31.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  32.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  33.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  34.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  35.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  36.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  37.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  38.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  39.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  40.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  41.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  42.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  43.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  44.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  45.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  46.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  47.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  48.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  49.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  50.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  51.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  52.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  53.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  54.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  55.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  56.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  57.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  58.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  59.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  60.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  61.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  62.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  63.     </div>
  64. </div>
  65.  
  66. <aside>
  67.   <div id="lateral">
  68.     <div id="lat_tit">
  69.       <h3 class="clase_fuente" align="center">Temas de Programacion Geek</h3>
  70.       <br />
  71.     </div>
  72.     <?php
  73.     for($i = 1 ;$i <= 50; $i++)
  74.     {
  75.     echo "<div class='item' style='font-weight:900;font-size:13px;'>Este es el tema numero $i </div><div class='item_esp'></div>";
  76.     }
  77.     ?>
  78.   </div>
  79. </aside>
  80.  
  81. <div id="num_comentarios" class="clase_fuente">37 Comentarios</div>
  82.  
  83. <aside>
  84. <kbd style="text-decoration:none;">
  85. <div id="comentarios">
  86.  
  87.     <?php
  88.     for($i = 1;$i<=10 ; $i++)
  89.     {
  90.     ?>
  91.     <div class="espacio" style="font-weight:900;">Anonimo dice:</div>
  92.     <div class="comentario">
  93.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  94.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  95.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />
  96.     jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj<br />    
  97.     </div>
  98.     
  99.     <?php } ?>
  100. </div>
  101. </kbd>
  102. </aside>
  103.  
  104. <div id="dej_com" class="clase_fuente">
  105.     <br />Deja tu comentario<br />
  106.     <textarea style="width:400px;height:140px;"></textarea><br /><br />
  107.     Codigo de seguridad<br />
  108.     2*4 = <input type="text" /> <input type="submit" value="Enviar Comentario" style="cursor:pointer;"/><br />
  109. </div>
  110.  
  111.  
  112.  
  113. </body>
  114. </html>

CSS
Código CSS: 
Ver original
  1. body {
  2. background:#369;
  3. position:relative;
  4. margin:0;
  5. }
  6.  
  7. .clase_fuente {
  8. font-family:Verdana, Arial, Helvetica, sans-serif;
  9. font-weight:900;
  10. }
  11.  
  12. #cabeza {
  13. position:relative;
  14. color:#FFF;
  15. width:1000px;
  16. height:120px;
  17. }
  18.  
  19. h1 {
  20. position:relative;
  21. top:10px;
  22. font-size:40px;
  23. font-weight:900;
  24. height:auto;
  25. margin:0;
  26. }
  27.  
  28. #botonera {
  29. position:relative;
  30. top:50px;
  31. left:30px;;
  32. width:970px;
  33. height:20px;
  34. font-size:18px;
  35. }
  36.  
  37. #boton1
  38. {
  39. position:relative;
  40. float:left;
  41. width:8%;
  42. height:20px;
  43. }
  44.  
  45. #boton2
  46. {
  47. position:relative;
  48. float:left;
  49. width:10%;
  50. height:20px;
  51. }
  52.  
  53. #boton3
  54. {
  55. position:relative;
  56. float:left;
  57. width:6%;
  58. height:20px;
  59. }
  60.  
  61. #boton4
  62. {
  63. position:relative;
  64. float:left;
  65. width:11%;
  66. height:20px;
  67. }
  68.  
  69. #contenido {
  70. position:relative;
  71. float:left;
  72. top:20px;
  73. width:700px;
  74. height:auto;
  75. overflow:auto;
  76. }
  77.  
  78. #lateral {
  79. position:absolute;
  80. left:730px;
  81. top:130px;
  82. width:250px;
  83. height:auto;
  84. background:#FFF;
  85. overflow:auto;
  86. font-family:Verdana, Arial, Helvetica, sans-serif;
  87. }
  88.  
  89. #lat_tit
  90. {
  91. position:relative;
  92. width:100%;
  93. height:auto;
  94. background:#FFF;
  95. overflow:hidden;
  96. background:#336699;
  97. color:#FFFFFF;
  98. }
  99.  
  100. .item
  101. {
  102. position:relative;
  103. height:auto;
  104. overflow:hidden;
  105. }
  106.  
  107. .item_esp
  108. {
  109. position:relative;
  110. height:10px;
  111. }
  112.  
  113. h3
  114. {
  115. position:relative;
  116. margin:0;
  117. font-size:14px;
  118. height:auto;
  119. }
  120.  
  121. #articulo {
  122. float:left;
  123. position:relative;
  124. left:3%;
  125. width:97%;
  126. background:#FFF;
  127. overflow:auto;
  128. height:auto;
  129. }
  130.  
  131. h2
  132. {
  133. position:relative;
  134. margin:0;
  135. top:10px;
  136. text-align:center;
  137. font-size:20px;
  138. height:25px;
  139. width:100%;
  140. }
  141.  
  142. #num_comentarios {
  143. position:relative;
  144. top:30px;
  145. left:30px;
  146. font-size:18px;
  147. height:auto;
  148. width:200px;
  149. color:#FFF;
  150. }
  151.  
  152. #comentarios {
  153. position:relative;
  154. left:30px;
  155. float:left;
  156. top:30px;
  157. height:auto;
  158. width:670px;
  159. overflow:auto;
  160. }
  161.  
  162. .comentario {
  163. position:relative;
  164. float:left;
  165. width:100%;
  166. background:#FFF;
  167. height:auto;
  168. overflow:auto;
  169. }
  170.  
  171. .espacio {
  172. position:relative;
  173. float:left;
  174. height:40px;
  175. width:100px;
  176. top:15px;
  177. font-size:18px;
  178. color:#FFFFFF;
  179. text-align:justify;
  180. }
  181.  
  182. #dej_com
  183. {
  184. position:relative;
  185. float:left;
  186. top:30px;
  187. width:670px;
  188. left:30px;
  189. height:300px;
  190. color:#FFFFFF;
  191. }
Última edición por hackjose; 14/09/2011 a las 18:46