Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje29-07-2016, 02:56 (UTC)    
Título del mensaje: [Css-design] Author

Hola a todos,
quiero compartir con ustedes ésta plantilla bastante personal, para webs que no requieran de tanta información Espero que les guste
Autor: Gabriel Navarro
Sitio web: pwgpro.es.tl

Captura



Por encima de la pagina

Código:

<!doctype html>
<html>
   <head>
      <meta charset="utf-8">
      <link rel="stylesheet" type="text/css" href="http://demo.pwgpro.com.ve/Author/stylesheet.css">
      <script src="https://use.fontawesome.com/b4e760a65b.js"></script>
      <title>Author | Pwgpro theme</title>
   </head>
   <body>
      <header>
         <center>
            <img draggable="false" src="http://demo.pwgpro.com.ve/Author/imagenes/x6.jpg">
         </center>
         <h1 id="Logo">Author</h1>
         <h2 id="Eslogan">Personal Creative Freemium Theme</h2>
      </header>
      <nav>
         <ul>
            <li><a href="http://demo.pwgpro.com.ve/Author/">Portada</a></li>
            <li><a href="#proyectos">Proyectos</a></li>
            <li><a href="#yo">Sobre mí</a></li>
            <li><a href="#">Contacto</a></li>
         </ul>
      </nav>
      <div class="Social"> <a href="http://facebook.com/webpwgpro"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="twitter.com/pwgpro"><i class="fa fa-twitter" aria-hidden="true"></i></a> <a href="https://plus.google.com/"><i class="fa fa-google-plus" aria-hidden="true"></i> </a><a href="https://www.instagram.com/gabriel713_717"><i class="fa fa-instagram" aria-hidden="true"></i> </a><a  href="https://ve.linkedin.com/in/gabrielnavarro95
         "><i class="fa fa-linkedin" aria-hidden="true"></i></a> </div>
      <section>


Welcome page

Código:
<div id="portada" class="divisor">
            <h1><i class="fa fa-home" aria-hidden="true"></i>
               Home | Articulos
            </h1>
         </div>
         <!-- Post 1 -->
         <div class="main">
            <img src="imagenes/post/entry5.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1>Hace unos dias...</h1>
                  <i class="fa fa-plus-square" aria-hidden="true"></i>
               </div>
            </a>
            <span> No!. No estaba orinando ¬¬. Aquí, mi valoracion a... las converse.</span>
         </div>
         <!-- Post 2 -->
         <div class="main">
            <img src="http://demo.pwgpro.com.ve/Author/imagenes/post/entry9.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1>Recomendaciones cuando te pierdes.</h1>
                  <i class="fa fa-plus-square" aria-hidden="true"></i>
               </div>
            </a>
            <span>Una vez que te pierdas, regresa al mismo lugar</span>
         </div>
         <!-- Post 3 -->
         <div class="main">
            <img src="http://demo.pwgpro.com.ve/Author/imagenes/post/entry3.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1>La musica más relajante 2016</h1>
                  <i class="fa fa-plus-square" aria-hidden="true"></i>
               </div>
            </a>
            <span>Musica para la boca. Para los oidos*</span>
         </div>
         <!-- Post 4 -->
         <div class="main">
            <img src="http://demo.pwgpro.com.ve/Author/imagenes/post/entry4.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1>Hablando sobre la kindle fire</h1>
                  <i class="fa fa-plus-square" aria-hidden="true"></i>
               </div>
            </a>
            <span>Menos mal que no es una canaimita</span>
         </div>
         <center><img style="margin-top:30px"  draggable="false" src="http://placehold.it/728x90"></center>
         <div id="proyectos" class="divisor">
            <h1><i class="fa fa-briefcase" aria-hidden="true"></i>
               Mis trabajos
            </h1>
         </div>
         <!-- Post 5 -->
         <div class="main">
            <img src="http://demo.pwgpro.com.ve/Author/imagenes/post/entry6.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1 class="work">Aliquam tincidunt mauris eu risus.</h1>
                  <i class="fa fa-eye" aria-hidden="true"></i>


               </div>
            </a>
            <span> Morbi in sem quis dui placerat ornare. Pellentesque odio.</span>
         </div>
         <!-- Post 6 -->
         <div class="main">
            <img src="http://demo.pwgpro.com.ve/Author/imagenes/post/entry7.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1 class="work">Aliquam tincidunt mauris eu risus.</h1>
                  <i class="fa fa-eye" aria-hidden="true"></i>


               </div>
            </a>
            <span> Morbi in sem quis dui placerat ornare. Pellentesque odio.</span>
         </div>
         <!-- Post 7 -->
         <div class="main">
            <img src="http://demo.pwgpro.com.ve/Author/imagenes/post/entry8.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1 class="work">Aliquam tincidunt mauris eu risus.</h1>
                  <i class="fa fa-eye" aria-hidden="true"></i>


               </div>
            </a>
            <span> Morbi in sem quis dui placerat ornare. Pellentesque odio.</span>
         </div>
         <!-- Post 8 -->
         <div class="main">
            <img src="http://demo.pwgpro.com.ve/Author/imagenes/post/entry4.jpg">
            <a href="http://demo.pwgpro.com.ve/Author/desarrollo.html">
               <div>
                  <h1 class="work">Aliquam tincidunt mauris eu risus.</h1>
                  <i class="fa fa-eye" aria-hidden="true"></i>


               </div>
            </a>
            <span> Morbi in sem quis dui placerat ornare. Pellentesque odio.</span>
         </div>
         <center><img style="margin-top:30px"  draggable="false" src="http://placehold.it/728x90"></center>
         <div id="yo" class="divisor">
            <h1><i class="fa fa-pencil" aria-hidden="true"></i>
               Sobre mi
            </h1>
         </div>
         
         <div id="me">
                  <center>
            <img draggable="false" src="http://demo.pwgpro.com.ve/Author/imagenes/x6.jpg">
         <h2>James blair</h2>
         <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti.

Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar nunc sapien ornare nisl. Phasellus pede arcu, dapibus eu, fermentum et, dapibus sed, urna.

Morbi interdum mollis sapien. Sed ac risus. Phasellus lacinia, magna a ullamcorper laoreet, lectus arcu pulvinar risus, vitae facilisis libero dolor a purus. Sed vel lacus. Mauris nibh felis, adipiscing varius, adipiscing in, lacinia vel, tellus. Suspendisse ac urna. Etiam pellentesque mauris ut lectus. Nunc tellus ante, mattis eget, gravida vitae, ultricies ac, leo. Integer leo pede, ornare a, lacinia eu, vulputate vel, nisl.
</p>
<a href="http://facebook.com/webpwgpro"><i class="fa fa-facebook" aria-hidden="true"></i></a>
<a href="twitter.com/pwgpro"><i class="fa fa-twitter" aria-hidden="true"></i></a>
<a href="https://plus.google.com/"><i class="fa fa-google-plus" aria-hidden="true"></i> </a>
<a href="https://www.instagram.com/gabriel713_717"><i class="fa fa-instagram" aria-hidden="true"></i> </a>
<a href="https://ve.linkedin.com/in/gabrielnavarro95"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
</center>
         </div>




Por debajo de la pagina

Código:
</section>
      <footer>
      <h1 id="Logo">Author</h1>
      <h2 id="Eslogan">Personal Creative Freemium Theme</h2>
      <p>Todos los derechos reservados</p>
<script>
<!--
document.write(unescape("%20%20%20%20%20%20%3Ca%20href%3D%22pwgpro.es.tl%22%3E%3Cimg%20draggable%3D%22false%22%20src%3D%22imagenes/Copyrights.png%22%3E%3C/a%3E%0A%20%20%20%20%20%20%3C/footer%3E%0A%20%20%20%3C/body%3E%0A%3C/html%3E"));
//-->
</script>


Sin style tag

Código:
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}
#webme_footer_textlink_dont_hide
{
background:#55493E;
color:#FFF;
font-family: 'Lora', serif;
float:left;
margin-top:-20px;
}





Nota:
En pwgpro está el codigo de una pagina mas de desarrollo de las entradas del diseño, y links para descargar codigos e imagenes. Así como también el css de base y la demostración en vivo.[/code]
______________
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group