elegante.html

  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>Sitio elegante</title>
  5.  
  6. <meta name="description" content="Un sitio muy elegante creado con estilos CSS3 para el curso de diseño de páginas de web" />
  7. <meta name="keywords" content="web, css, curso, página" />
  8.  
  9. <link href="elegante.css" rel="stylesheet" type="text/css" />
  10.  
  11. </head>
  12.  
  13. <div id="principal">
  14.  
  15. <div id="encabezado">
  16. <h1>Sitio elegante</h1>
  17. </div>
  18.  
  19. <div id="contenido">
  20. <h2>Contenido</h2>
  21. <img src="pajarito.jpg" alt="Pajarito" width="250" height="431" align="right" />
  22. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum posuere iaculis. Aliquam tristique libero non magna rutrum quis consectetur ligula varius. Quisque volutpat tincidunt eros eu luctus. Integer facilisis pellentesque sapien in condimentum. Aenean a nunc ac nibh vehicula interdum in nec mi. Nulla at leo non augue luctus luctus quis in sapien. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent eleifend semper velit, vel hendrerit ante tempor vel. Morbi nec pulvinar lorem. Sed ut ullamcorper nisi. Quisque tristique suscipit ipsum et luctus. Donec vehicula cursus velit quis volutpat. Sed sodales placerat lacus non facilisis. Vestibulum odio lorem, tincidunt a tincidunt sed, scelerisque vel ipsum. Aenean ac nisi a tortor suscipit facilisis vitae id urna. </p>
  23. <p>Curabitur rhoncus tempus elit, id mollis libero scelerisque id. Vestibulum sit amet mollis erat. Cras urna mauris, tristique eu pharetra egestas, vestibulum in lorem. Praesent luctus ligula lorem. Aenean tempus lobortis metus, at rhoncus tellus malesuada non. In hac habitasse platea dictumst. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; </p>
  24. <p>Nam vitae dignissim diam. Praesent posuere dolor mattis ligula bibendum id semper sem lacinia. Phasellus non libero justo, a dignissim felis. Sed posuere pellentesque libero nec tincidunt. Nullam gravida sem quis ligula facilisis aliquet. Phasellus feugiat lorem ut lorem ultricies dignissim. Duis bibendum libero ipsum. Pellentesque vel enim leo, et bibendum metus. Duis tempor dapibus massa, ut lacinia nisi vulputate malesuada. Donec ultricies molestie magna. Sed lacus purus, blandit eu molestie nec, interdum sed risus. Ut eget ante vel ante sodales aliquet sed sit amet felis. Vivamus varius egestas sem, et eleifend dolor aliquam vitae. Vestibulum magna arcu, ornare nec sagittis non, vulputate id arcu. Etiam dolor leo, pulvinar et posuere id, fermentum a massa. </p>
  25. <p>Vestibulum tempor lacus vitae ante dignissim vestibulum. Donec consequat egestas tortor, in luctus purus suscipit quis. Vestibulum rhoncus diam vel nibh pellentesque sed eleifend neque semper. Nunc sapien lectus, consectetur et eleifend suscipit, viverra quis leo. Cras a leo tortor, ut tincidunt velit. Vivamus dictum feugiat erat sed euismod. Sed dictum purus vitae arcu fringilla volutpat lacinia dui aliquet. Nulla bibendum commodo tortor, nec malesuada eros rutrum adipiscing. Vestibulum placerat gravida metus, accumsan mollis ante posuere at. Praesent a libero ac lacus sodales hendrerit ut tincidunt lorem. Donec venenatis sollicitudin semper. Morbi rhoncus purus sollicitudin augue venenatis sed elementum justo volutpat. Praesent quis purus et nisi feugiat luctus ac vitae nunc. Cras ultricies sem a erat mollis pellentesque. Sed laoreet justo sed mi sodales faucibus. </p>
  26. </div>
  27.  
  28. <div id="pie">
  29. ProInf.net &copy;2012
  30. </div>
  31.  
  32. </div><!--principal-->
  33.  
  34. </body>
  35. </html>
  36.  

Proinf.net