Drakox Official Web Site
Home
Afiliados
IconPack1
Cabezales
Probador HTML
Iconos messenger
psBrushes
Fuentes
pstutoriales
Trampa
Prueba1
css design
Afiliados1
Título de la nueva página
contacto
Comunidadl
Plantillas
Modificadores
Copyright
Tutoriales
2 excelentes webs para encontrar iconos
Bigassmessage
Blendfu
inspiracion1
Título de la hnueva página
Título de lddda nueva página
1024x1024
1024x768
1152x864
1280x800
1280x854
1280x960
1440x900
1600x1200
1680x1024
1680x1050
1920x1080
1920x1200
comentarios
Plantillas
23 de diciembre de 2009 |
Support |
19:06
Navidad/Christmas Design
Encima de la página
<div id="wrap"> <div id="header"> <h1 id="logo-text"><a href="#" _fcksavedurl="#"></a></h1> <p id="slogan"></p> <div id="header-links"> <p> <a href="#" _fcksavedurl="#">Link</a> | <a href="#" _fcksavedurl="#">Link2</a> </p> </div> </div> <div id="menu"> <ul> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> </ul> </div> <div id="content-wrap"> <div id="sidebar"> <div class="left-box"> <p class="align-right"></p> </div> </div>
Debajo de la página
</div> <div id="footer"> </div> </div><br />
CSS CODE Sin style tags
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;} /* Top Elements */ * { margin: 0; padding: 0; outline: 0 } body { background-image:url(http://www.zastavki.com/pictures/1280x800/2008/Christmas_wallpapers_Christmas_2009_011374_.jpg);background-color:#ffffff; font: 70%/1.5em Verdana, Tahoma, arial, sans-serif; color: #555; text-align: center; } /* links */ a, a:visited { text-decoration: none; color: #2180BC; background: inherit; } a:hover { color: #88ac0b; background: inherit; text-decoration: underline; } /* headers */ h1, h2, h3 { font-family: 'Trebuchet MS', Tahoma, Sans-serif; } h1 { font-size: 150%; font-weight: normal; color: #cccccc; } h2 { font-size: 140%; text-transform: uppercase; color: #cccccc; } h3 { font-size: 120%; color: #cccccc; } h1, h2, h3, p { padding: 10px; margin: 0; } ul, ol { margin: 5px 20px; padding: 0 20px; } /******************************************** Design ********************************************/ #wrap { width: 838px; background: url(http://img45.xooimage.com/files/8/a/3/bg-142ed19.png) repeat-y center top; margin: 0 auto; text-align: left; } #content-wrap { clear: both; width: 760px; padding: 0; margin: 10px auto; } #header { width: 838px; position: relative; height: 150px; background: #fff url(http://img42.xooimage.com/files/e/9/f/headerchristmas-16bd301.png) no-repeat center top; padding: 0; } #header h1#logo-text a { position: absolute; margin: 0; padding: 0; font: bolder 44px 'Trebuchet MS', Arial, Sans-serif; letter-spacing: -2px; color: #FFF; text-transform: none; text-decoration: none; background: transparent; /* change the values of top and left to adjust the position of the logo*/ top: 25px; left: 47px; } #header p#slogan { position: absolute; margin: 0; padding: 0; font: normal 12px 'Trebuchet MS', Arial, Sans-serif; text-transform: none; color: #FFF; /* change the values of top and left to adjust the position of the slogan*/ top: 70px; left: 55px; } /* header links */ #header #header-links { position: absolute; top: 20px; right: 30px; color: #ffffff; font-size: 10px; } #header #header-links a { color: #FFF; text-decoration: none; } #header #header-links a:hover { color: #cccccc; } /* Menu */ #menu { clear: both; margin: 0 auto; padding: 0; background: url(http://img26.xooimage.com/files/1/b/e/menuchristmas-16bd309.png) repeat-x 0 0; font: bold 12px/37px Verdana, Arial, Tahoma, Sans-serif; height: 28px; width: 838px; } #menu ul { float: right; list-style: none; margin:0; padding: 0; } #menu ul li { display: inline; } #menu ul li a { display: block; float: left; padding: 0 12px; color: #FFF; text-decoration: none; } #menu ul li.last a { padding-right: 20px; } #menu ul li a:hover { color: #cccccc; } #menu ul li#current a { color: #bc0303; } /* Main Column */ #main { float: left; width: 70%; padding: 0; margin: 5px 0 0 5px; display: inline; } #main h2 { margin-top: 30px; font: Bold 140% 'Trebuchet MS', Tahoma, Sans-serif; color: #88ac0b; padding: 5px 0 5px 25px; border-bottom: 1px solid #EFF0F1; background: #FFF none no-repeat 3px 50%; text-transform: none; } #main h2 a { background: none; color: #88ac0b; text-decoration: none; } #main ul li { list-style-image: none; } .post-footer { background-color: #FAFAFA; padding: 5px; margin: 20px 10px 10px 10px; border: 1px solid #f2f2f2; font-size: 95%; } .post-footer .date { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .comments { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .readmore { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } /* Sidebar */ #sidebar { float: right; width: 26.5%; padding: 0; margin: 0; color: #000; } #sidebar h3 { margin-top: 10px; padding: 20px 20px; font: bold 1.4em 'Trebuchet MS', Tahoma, Sans-serif; color: #bc0303; } #sidebar ul.sidemenu { list-style: none; text-align: left; margin: 7px 4px 8px 0; padding: 0; text-decoration: none; background: none repeat-x left top; } #sidebar ul.sidemenu li { list-style: none; background: none repeat-x left bottom; padding: 4px 0 4px 5px; margin: 0 20px; color: #bc0303; } * html body #sidebar ul.sidemenu li { height: 1%; } #sidebar ul.sidemenu li a { text-decoration: none; background-image: none; color: #666666; } #sidebar ul.sidemenu li a:hover { color: #1773BC; } #sidebar ul.sidemenu ul { margin: 0 0 0 5px; padding: 0; } #sidebar ul.sidemenu ul li { background: none; } /* Footer */ #footer { color: #C6DDEE; background: url(http://img44.xooimage.com/files/3/9/6/footernavidad-16bd3e8.png);background-color:#a90000; no-repeat center top; clear: both; width: 838px; height: 76px; text-align: center; font-size: 92%; } #footer a { color: #FFF; text-decoration: none; } /* alignment classes */ .float-left { float: left; } .float-right { float: right; } .align-left { text-align: left; } .align-right { text-align: right; } /* display and additional classes */ .clear { clear: both; }
24 de diciembre de 2009 |
Support |
20:06
Adobe® Photoshop
Por encima de la página
<div id="wrap"> <div id="header"> <h1 id="logo-text"><a href="#" _fcksavedurl="#"></a></h1> <p id="slogan"></p> <div id="header-links"> <p> <a href="#" _fcksavedurl="#">Link</a> | <a href="#" _fcksavedurl="#">Link2</a> </p> </div> </div> <div id="menu"> <ul> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> <li><a href="Url" _fcksavedurl="Url">Link</a></li> </ul> </div> <div id="content-wrap"> <div id="sidebar"> <div class="left-box"> <p class="align-right"></p> </div> </div>
Por debajo de la página
</div> <div id="footer"> </div> </div><br />
CSS Code sin style tags
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;} /* Top Elements */ * { margin: 0; padding: 0; outline: 0 } body { background-image:url(http://farm3.static.flickr.com/2044/2346425495_8bd73cbdbc_b.jpg);background-color:#ffffff; font: 70%/1.5em Verdana, Tahoma, arial, sans-serif; color: #555; text-align: center; } /* links */ a, a:visited { text-decoration: none; color: #2180BC; background: inherit; } a:hover { color: #88ac0b; background: inherit; text-decoration: underline; } /* headers */ h1, h2, h3 { font-family: 'Trebuchet MS', Tahoma, Sans-serif; } h1 { font-size: 150%; font-weight: normal; color: #cccccc; } h2 { font-size: 140%; text-transform: uppercase; color: #cccccc; } h3 { font-size: 120%; color: #cccccc; } h1, h2, h3, p { padding: 10px; margin: 0; } ul, ol { margin: 5px 20px; padding: 0 20px; } /******************************************** Design ********************************************/ #wrap { width: 838px; background: url(http://img45.xooimage.com/files/8/a/3/bg-142ed19.png) repeat-y center top; margin: 0 auto; text-align: left; } #content-wrap { clear: both; width: 760px; padding: 0; margin: 10px auto; } #header { width: 838px; position: relative; height: 150px; background: #fff url(http://img41.xooimage.com/files/d/6/2/headerps-16ce3e9.png) no-repeat center top; padding: 0; } #header h1#logo-text a { position: absolute; margin: 0; padding: 0; font: bolder 44px 'Trebuchet MS', Arial, Sans-serif; letter-spacing: -2px; color: #FFF; text-transform: none; text-decoration: none; background: transparent; /* change the values of top and left to adjust the position of the logo*/ top: 25px; left: 47px; } #header p#slogan { position: absolute; margin: 0; padding: 0; font: normal 12px 'Trebuchet MS', Arial, Sans-serif; text-transform: none; color: #FFF; /* change the values of top and left to adjust the position of the slogan*/ top: 70px; left: 55px; } /* header links */ #header #header-links { position: absolute; top: 20px; right: 30px; color: #ffffff; font-size: 10px; } #header #header-links a { color: #FFF; text-decoration: none; } #header #header-links a:hover { color: #cccccc; } /* Menu */ #menu { clear: both; margin: 0 auto; padding: 0; background: url(http://img49.xooimage.com/files/2/7/4/menups-16ce483.png) repeat-x 0 0; font: bold 12px/37px Verdana, Arial, Tahoma, Sans-serif; height: 28px; width: 838px; } #menu ul { float: right; list-style: none; margin:0; padding: 0; } #menu ul li { display: inline; } #menu ul li a { display: block; float: left; padding: 0 12px; color: #FFF; text-decoration: none; } #menu ul li.last a { padding-right: 20px; } #menu ul li a:hover { color: #cccccc; } #menu ul li#current a { color: #bc0303; } /* Main Column */ #main { float: left; width: 70%; padding: 0; margin: 5px 0 0 5px; display: inline; } #main h2 { margin-top: 30px; font: Bold 140% 'Trebuchet MS', Tahoma, Sans-serif; color: #88ac0b; padding: 5px 0 5px 25px; border-bottom: 1px solid #EFF0F1; background: #FFF none no-repeat 3px 50%; text-transform: none; } #main h2 a { background: none; color: #88ac0b; text-decoration: none; } #main ul li { list-style-image: none; } .post-footer { background-color: #FAFAFA; padding: 5px; margin: 20px 10px 10px 10px; border: 1px solid #f2f2f2; font-size: 95%; } .post-footer .date { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .comments { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .readmore { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } /* Sidebar */ #sidebar { float: right; width: 26.5%; padding: 0; margin: 0; color: #000; } #sidebar h3 { margin-top: 10px; padding: 20px 20px; font: bold 1.4em 'Trebuchet MS', Tahoma, Sans-serif; color: #bc0303; } #sidebar ul.sidemenu { list-style: none; text-align: left; margin: 7px 4px 8px 0; padding: 0; text-decoration: none; background: none repeat-x left top; } #sidebar ul.sidemenu li { list-style: none; background: none repeat-x left bottom; padding: 4px 0 4px 5px; margin: 0 20px; color: #bc0303; } * html body #sidebar ul.sidemenu li { height: 1%; } #sidebar ul.sidemenu li a { text-decoration: none; background-image: none; color: #666666; } #sidebar ul.sidemenu li a:hover { color: #1773BC; } #sidebar ul.sidemenu ul { margin: 0 0 0 5px; padding: 0; } #sidebar ul.sidemenu ul li { background: none; } /* Footer */ #footer { color: #C6DDEE; background: url(http://img25.xooimage.com/files/e/a/a/footerps-16ce493.png);background-color:#a90000; no-repeat center top; clear: both; width: 838px; height: 76px; text-align: center; font-size: 92%; } #footer a { color: #FFF; text-decoration: none; } /* alignment classes */ .float-left { float: left; } .float-right { float: right; } .align-left { text-align: left; } .align-right { text-align: right; } /* display and additional classes */ .clear { clear: both; }
38559 visitantes (82418 clics a subpáginas)
Este sitio web fue creado de forma gratuita con
PaginaWebGratis.es
. ¿Quieres también tu sitio web propio?
Registrarse gratis