Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje26-08-2014, 00:23 (UTC)    
Título del mensaje: [CSS Design] Architectures
Responder citando
Espero les guste.



codigo por encima de la pagina

Cita:

<!DOCTYPE html>
<html>
<body>
<nav>
<h1>Title web</h1>
<ul>
<li><a href="#">Enlace</a></li>
<li><a href="#">Enlace</a></li>
<li><a href="#">Enlace</a></li>
<li><a href="#">Enlace</a></li>
</ul>
</nav>
<header>
<div class="hwrap">
<h2>Lorem ipsum</h2>
</div>
</header>
<section id="intro">
<div class="intro-w">
<h2><strong>dolor sit amet</strong> Maecenas ullamcorper, dui et placerat feugiat, eros pede varius nisi, condimentum viverra felis nunc et lorem.</h2>
</div>
</section>
<main>
<section class="wrapper">
<a name="TemplateInfo"></a>


codigo por debajo de la pagina

Cita:

</section>
<aside>
<div class="abox">
<h3>luctus pulvinar,</h3>
<ul>
<li><a href="#">posuere eget</a></li>
<li><a href="#">Pellentesque posuere</a></li>
<li><a href="#">Phasellus magna</a></li>
<li><a href="#">Nunc nulla</a></li>
<li><a href="#">Pellentesque libero tortor</a></li>
</ul>
</div>
<div class="abox">
<h3>hendrerit id</h3>
<ul>
<li><a href="#">Nullam vel sem</a></li>
<li><a href="#">Sed magna</a></li>
<li><a href="#">Proin sapien ipsum</a></li>
<li><a href="#">Nullam dictum</a></li>
<li><a href="#">Cras dapibus</a></li>
</ul>
</div>
<div class="abox">
<h3>Donec vitae sapien</h3>
<a href="#"><img src="img/320x157.png"></a>
</div>
</aside>
<footer><p>Design web by: <a href="http://webgrafica.es.tl">WebGrafica</a> | Lorem ipsum dolor sit amet consequat phasellus.</p></footer>
</main>
</body>
</html>


codigo en CSS Style

Cita:
/** Por defecto **/
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: none;
display: table !important;
width: 1000px;
margin: auto;
text-align: center;
}
#webme_sky_ad{top: 0px;}
table{margin-left:auto;margin-right:auto;}
/** generales **/
*{
margin: 0;
padding: 0;
}

body{
background-color: #333;
color: #666;font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
font-size: 14px;
}

a{
text-decoration: none;
color: #ff4200;
}

a:hover{
color: #000;
}

ul{
list-style: none;
}

main{
margin-bottom: 20px;
background: #FFF;
}

/** header **/

header{
border-bottom: 5px solid #999;
border-top: 5px solid #999;
position: relative;
background: url('img/header.jpg') center;
height: 400px;
background-size: cover;
}

header div.hwrap{
vertical-align: baseline;
bottom: 0;
position: absolute;
width: 100%;
text-align: center;
background: rgba(0,0,0,0.8 );
margin-bottom: 10px;
padding: 30px 0;
color: #FFF;
}

/** intro **/

section#intro{
background: #f3f3f3;
padding: 40px 0;
text-align: center;
}

div.intro-w, footer, section.wrapper, aside{
width: 1000px;
margin: auto;
}

section#intro h2{
font-weight: normal;
}

section#intro h2 strong{
color: #ff4200;
}

/** nav **/

nav{
margin: auto;
width: 1000px;
display: table;
}

nav h1{
color: #FFF;
display: inline;
line-height: 60px;
text-transform: uppercase;
}

nav ul{
float: right;
}

nav ul li{
float: left;
height: 60px;
}

nav ul li a{
line-height: 60px;
padding: 0 30px;
font-weight: bold;
color: #999;
font-style: italic;
}

nav ul li a:hover{
color: #ff4200;
}

/** wbox **/

section.wrapper{
padding: 20px 0;
display: table;
}

div.wbox{
width: 250px;
float: left;
}

div.wbox-wrap{
margin: 0 5px;
padding: 10px;
background: #EEE;
border: 1px solid #999;
}

div.wbox-wrap img{
width: 220px;
border-radius: 100px;
}

div.wbox-wrap h3{
margin: 5px 0;
color: #333;
}

div.wbox-wrap a{
display: block;
text-align: center;
background: #ff4200;
padding: 10px;
border-radius: 5px;
margin-top: 10px;
border: 2px solid #FFF;
font-weight: bold;
color: #DDD;
transition: border 0.3s, color 0.3s;
}

div.wbox-wrap a:hover{
color: #333;
border: 2px solid #333;
}

/** Sidebar **/

aside{
background: #333;
padding: 20px;
width: 960px;
display: table;
}

aside div.abox{
float: left;
width: 320px;
color: #EEE;
}

aside div.abox h3{
color: #FFF;
margin-bottom: 5px;
margin-left: 10px;
}

aside div.abox ul{
padding: 10px;
}

aside div.abox ul li a{
display: block;
color: #DDD;
margin-bottom: 5px;
padding-bottom: 5px;
border-bottom: 1px dashed #999;
}

aside div.abox ul li a:hover{
background: #666;
color: #f3f3f3;
}

aside div.abox img{
width: 320px;
height: 157px;
}
/** footer **/

footer{
font-family: 'Open Sans Condensed', sans-serif;
text-align: center;
font-size: 12px;
padding: 30px 0;
margin-top: 20px;
font-weight: 700;
letter-spacing: 1px;
border-top: 1px solid #BBB;
color: #AAA;
font-weight: bold;
text-transform: uppercase;
}

footer a, footer a:hover{color: #ff4200;}


codigo en pagina de inicio (home - inicio)

Cita:

<div class="wbox">
<div class="wbox-wrap">
<img src="img/220x220-1.png">
<h3>Ultricies nisi</h3>
<p>Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus.</p>
<a href="#" class="wboxb">sit amet...</a>
</div>
</div>
<div class="wbox">
<div class="wbox-wrap">
<img src="img/220x220-2.png">
<h3>Ultricies nisi</h3>
<p>Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus.</p>
<a href="#" class="wboxb">sit amet...</a>
</div>
</div>
<div class="wbox">
<div class="wbox-wrap">
<img src="img/220x220-3.png">
<h3>Ultricies nisi</h3>
<p>Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus.</p>
<a href="#" class="wboxb">sit amet...</a>
</div>
</div>
<div class="wbox">
<div class="wbox-wrap">
<img src="img/220x220-4.png">
<h3>Ultricies nisi</h3>
<p>Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus.</p>
<a href="#" class="wboxb">sit amet...</a>
</div>
</div>


En caso de error reportarlo porfavor directamente desde webgrafica


Ultima edición por WebGrafica el Mar Ago 26, 2014 2:39 pm; editado 1 vez
↑
Mensaje26-08-2014, 06:50 (UTC)    
Título del mensaje: Re: [CSS Design] Architectures
Responder citando
hola, el codigo tiene un par de fallos...
-lo del protocolo de internet no es necesario, eso solo lo seria si fuera subir el archivo a un servidor...
- la llamada a codigo css tambien sobra, puesto que el mismo css esta en el mismo sitio.
- a mitad del css hay un guiño gif que podria ser mal interpretado por el codigo.
esto parece mas un codigo fuente que un codigo creado en si :D en cuyo caso seria mejor poner el enlace al original para demostrar que es free y no sacado de manera no permitida.
______________

10 años ayudando a la comunidad!!
>las cuestiones de problemas con webs se atienden en el foro.
>Ticket a: ayuda@paginawebgratis.es -- Reportes a: support-es@webme.com
↑
Mensaje26-08-2014, 18:38 (UTC)    
Título del mensaje: Re: [CSS Design] Architectures
Responder citando
javidj escribió:
hola, el codigo tiene un par de fallos...
-lo del protocolo de internet no es necesario, eso solo lo seria si fuera subir el archivo a un servidor...
- la llamada a codigo css tambien sobra, puesto que el mismo css esta en el mismo sitio.
- a mitad del css hay un guiño gif que podria ser mal interpretado por el codigo.
esto parece mas un codigo fuente que un codigo creado en si :D en cuyo caso seria mejor poner el enlace al original para demostrar que es free y no sacado de manera no permitida.


ya corrijo los errores.
pero el codigo es miio... :C yo lo trabajé.
↑
Mostrar mensajes anteriores:   
  • Página 1 de 1

  •  
    • Saltar a:  


Powered by phpBB © 2001, 2005 phpBB Group

© 2024 webme GmbH, Alemania. Todos los derechos reservados.