Foros del Web - Ver Mensaje Individual

vesper_metal90 · #6 (**permalink**) 25/07/2013, 01:23

Yo lo hice asi

Código HTML:

Ver original<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
      $(function(){
        $("select#tipoCss").change(function(){
          cambiar();
        });        
        function cambiar(){
          var plantilla = $("select#tipoCss").val();
          if(plantilla == ""){
            $("select#tipoCss option:selected");
            return false;
          }else{
            $("plantilla").html("<link rel=\"stylesheet\" href=\"css/"+plantilla+".css\"/>");
          }
        }
      });
     
    </script>
    <link rel="stylesheet" href="css/base.css"/>
  </head>
  <body>
  <plantilla>
  </plantilla>
  <select id="tipoCss" name="plantilla">
    <option value="">Selecciona una plantilla</option>
    <option value="pc">Plantilla para PC</option>
    <option value="smartPhone">Plantilla smartPhone</option>
    <option value="pchd">Plantilla alta definicion</option>
    <option value="tablet">Plantilla para tableta digital</option>
  </select>
  <hr>
  <div id="contenedors">
    <header>
      <div id="titulo">
        <div id="logo"> 
        </div>
        <h1>Edgar de Jesus Mendoza Ortegon</h1>
        <h2>Eslogan de la web</h2>
      </div>
      <nav>
        <ul>
          <li>
            <a href="index.php">Inicio</a>
          </li>
          <li>
            <a href="blog.php">Blog</a>
          </li>
          <li>
            <a href="productos.php">Productos</a>
          </li>
          <li>
            <a href="contacto.php">Contacto</a>
          </li>
        </ul>
      </nav>
      Cabecera
    </header>
    <section>
      Contenido
      <div id="banner">
        <h3>Titulo del Destacado</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut lectus eu massa imperdiet tincidunt. Praesent tincidunt aliquam mauris, non pretium est malesuada in. Aliquam orci tortor, facilisis ac arcu non, euismod mollis nulla. Duis accumsan pulvinar porttitor. Donec erat eros, dapibus ac sem sit amet, tempus ultricies urna. Ut pretium lorem id magna pharetra, sit amet faucibus sem pulvinar. Donec placerat, nulla sed ultricies vestibulum, justo dolor tincidunt sem, vel venenatis dui lacus at tortor. Fusce scelerisque molestie pharetra. Fusce bibendum nibh id augue euismod congue.</p>
 
      </div>
      <article>
        <div class="imagendestacado" id="img1"></div>
        <h3>Titulo del Destacado</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut lectus eu massa imperdiet tincidunt. Praesent tincidunt aliquam mauris, non pretium est malesuada in. Aliquam orci tortor, facilisis ac arcu non, euismod mollis nulla. Duis accumsan pulvinar porttitor. Donec erat eros, dapibus ac sem sit amet, tempus ultricies urna. Ut pretium lorem id magna pharetra, sit amet faucibus sem pulvinar. Donec placerat, nulla sed ultricies vestibulum, justo dolor tincidunt sem, vel venenatis dui lacus at tortor. Fusce scelerisque molestie pharetra. Fusce bibendum nibh id augue euismod congue.</p>
      </article>
      <article>
        <h3>Titulo del Destacado</h3>
        <div class="imagendestacado" id="img2"></div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut lectus eu massa imperdiet tincidunt. Praesent tincidunt aliquam mauris, non pretium est malesuada in. Aliquam orci tortor, facilisis ac arcu non, euismod mollis nulla. Duis accumsan pulvinar porttitor. Donec erat eros, dapibus ac sem sit amet, tempus ultricies urna. Ut pretium lorem id magna pharetra, sit amet faucibus sem pulvinar. Donec placerat, nulla sed ultricies vestibulum, justo dolor tincidunt sem, vel venenatis dui lacus at tortor. Fusce scelerisque molestie pharetra. Fusce bibendum nibh id augue euismod congue.</p>
      </article>
      <article>
        <h3>Titulo del Destacado</h3>
        <div class="imagendestacado" id="img3"></div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut lectus eu massa imperdiet tincidunt. Praesent tincidunt aliquam mauris, non pretium est malesuada in. Aliquam orci tortor, facilisis ac arcu non, euismod mollis nulla. Duis accumsan pulvinar porttitor. Donec erat eros, dapibus ac sem sit amet, tempus ultricies urna. Ut pretium lorem id magna pharetra, sit amet faucibus sem pulvinar. Donec placerat, nulla sed ultricies vestibulum, justo dolor tincidunt sem, vel venenatis dui lacus at tortor. Fusce scelerisque molestie pharetra. Fusce bibendum nibh id augue euismod congue.</p>
      </article>
    </section>
    <footer>
      <h6>(c) 2013 Edgar de jesus Mendoza Ortegon</h6>
    </footer>
  </div>
</body>
</html>