Los-Recursos - La mejor ayuda webmaster.

Webtile

Por encima de la pagina

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>WebTile</title> <FCK:meta http-equiv="content-type" content="text/html; charset=utf-8"  /> <link href="style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/cufon-yui.js"></script> <script type="text/javascript" src="js/arial.js"></script> <script type="text/javascript" src="js/cuf_run.js"></script> <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="js/radius.js"></script>  </head> <body> <div class="main">   <div class="header">     <div class="header_resize">       <div class="logo">         <h1><a href="index.html" _fcksavedurl="index.html">TU<span>WEB</span></a> <small>texto texto texto</small></h1>       </div>        <div class="clr"></div>       <div class="menu_nav">         <ul>           <li class="active"><a href="#" _fcksavedurl="#">Home</a></li>           <li><a href="#" _fcksavedurl="#">Menu</a></li>           <li><a href="#" _fcksavedurl="#">Menu</a></li>           <li><a href="#" _fcksavedurl="#">Menu</a></li>            <li><a href="#" _fcksavedurl="#">Menu</a></li>         </ul>         <div class="searchform">           <form id="formsearch" name="formsearch" method="post" action="#">             <span>             <input name="editbox_search" class="editbox_search" id="editbox_search" maxlength="80" value="Search our ste:" type="text" />             </span>             <input name="button_search" src="http://img201.imageshack.us/img201/2474/searchbtn.gif" class="button_search" type="image" />            </form>         </div>       </div>       <div class="clr"></div>     </div>   </div>   <div class="content">     <div class="content_resize"> <img src="http://img84.imageshack.us/img84/9168/hbgimg.jpg" _fcksavedurl="http://img84.imageshack.us/img84/9168/hbgimg.jpg" width="958" height="245" alt="" class="hbg_img" />        <div class="mainbar">         <div class="article">           <h2><span>Contenido</span> </h2>           <div class="clr"></div>

Por debajo de la pagina

</div>         <p class="pages"><small>Page 1 of 2    </small> <span>1</span> <a href="#" _fcksavedurl="#">2</a> <a href="#" _fcksavedurl="#">»</a></p>        </div>       <div class="sidebar">         <div class="gadget">           <h2 class="star"><span>SubMenu1</span></h2>           <div class="clr"></div>           <ul class="sb_menu">             <li><a href="#" _fcksavedurl="#">Home</a></li>             <li><a href="#" _fcksavedurl="#">Nombre</a></li>             <li><a href="#" _fcksavedurl="#">Nombre</a></li>             <li><a href="#" _fcksavedurl="#">Nombre</a></li>             <li><a href="#" _fcksavedurl="#">Archives</a></li>           </ul>         </div>         <div class="gadget">            <h2 class="star"><span>SubMenu2</span></h2>           <div class="clr"></div>           <ul class="ex_menu">             <li><a href="#" _fcksavedurl="#">Titulo</a><br />             Descripcion</li>            <li><a href="#" _fcksavedurl="#">Titulo</a><br />             Descripcion</li>              <li><a href="#" _fcksavedurl="#">Titulo</a><br />             Descripcion</li>              <li><a href="#" _fcksavedurl="#">Titulo</a><br />             Descripcion</li>           <li><a href="#" _fcksavedurl="#">Titulo</a><br />             Descripcion</li>           <li><a href="#" _fcksavedurl="#">Titulo</a><br />             Descripcion</li>           </ul>         </div>       </div>       <div class="clr"></div>     </div>   </div>    <div class="fbg">     <div class="fbg_resize">       <div class="col c1">         <h2><span>Galeria</span></h2>         <a href="#" _fcksavedurl="#"><img src="http://img577.imageshack.us/img577/735/pix1.jpg" _fcksavedurl="http://img577.imageshack.us/img577/735/pix1.jpg" width="58" height="58" alt="" /></a> <a href="#" _fcksavedurl="#"><img src="http://img820.imageshack.us/img820/3656/pix2d.jpg" _fcksavedurl="http://img820.imageshack.us/img820/3656/pix2d.jpg" width="58" height="58" alt="" /></a> <a href="#" _fcksavedurl="#"><img src="http://img546.imageshack.us/img546/9395/pix3.jpg" _fcksavedurl="http://img546.imageshack.us/img546/9395/pix3.jpg" width="58" height="58" alt="" /></a> <a href="#" _fcksavedurl="#"><img src="http://img546.imageshack.us/img546/9395/pix3.jpg" _fcksavedurl="http://img546.imageshack.us/img546/9395/pix3.jpg" width="58" height="58" alt="" /></a> <a href="#" _fcksavedurl="#"><img src="http://img17.imageshack.us/img17/3005/pix5f.jpg" _fcksavedurl="http://img17.imageshack.us/img17/3005/pix5f.jpg" width="58" height="58" alt="" /></a> <a href="#" _fcksavedurl="#"><img src="http://img37.imageshack.us/img37/7512/pix6q.jpg" _fcksavedurl="http://img37.imageshack.us/img37/7512/pix6q.jpg" width="58" height="58" alt="" /></a> </div>        <div class="col c2">          <h2><span>Lorem Ipsum</span></h2>         <p>Lorem ipsum dolor<br />           Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. <a href="#" _fcksavedurl="#">Morbi tincidunt, orci ac convallis aliquam</a>, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Donec mattis, purus nec placerat bibendum, dui pede condimentum odio, ac blandit ante orci ut diam.</p>       </div>       <div class="col c3">          <h2><span>Contact</span></h2>         <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue.</p>         <p><a href="#" _fcksavedurl="#">support@yoursite.com</a></p>         <p>+1 (123) 444-5677<br />           +1 (123) 444-5678</p>         <p>Address: 123 TemplateAccess Rd1</p>        </div>       <div class="clr"></div>     </div>   </div>   <div class="footer">     <div class="footer_resize">       <p class="lf">© Copyright <a href="#" _fcksavedurl="#">MyWebSite</a>.</p>        <p class="rf">Plantilla adaptada por <a href="http://www.lostrax.es.tl/" _fcksavedurl="http://www.lostrax.es.tl/">lostrax</a></p>       <div class="clr"></div>     </div>   </div> </div> </body> </html>

Css code sin style tags

#header_container {display: none;} #nav_container {display: none;} h2#title {display: none;} table[height="102"] {margin-left:auto; margin-right:auto;}  @charset "utf-8"; body { 	margin:0; 	padding:0; 	width:100%; 	color:#959595; 	font:normal 12px/1.8em Arial, Helvetica, sans-serif; } html, .main { 	padding:0; 	margin:0; } .main { 	background:#fff url(http://img89.imageshack.us/img89/5342/headerbga.gif) repeat-x center top; } .clr { 	clear:both; 	padding:0; 	margin:0; 	width:100%; 	font-size:0; 	line-height:0; } .logo { 	padding:0; 	width:auto; } h1 { 	margin:0; 	padding:24px 40px; 	color:#fff; 	font:bold 46px/1.2em Arial, Helvetica, sans-serif; 	letter-spacing:-3px; } h1 a, h1 a:hover { 	color:#fff; 	text-decoration:none; } h1 span { 	color:#40b5ff; } h1 small { 	display:block; 	margin-top:-4px; 	padding-left:104px; 	font:normal 12px/1.2em Arial, Helvetica, sans-serif; 	letter-spacing:normal; 	color:#fff; } h2 { 	font:normal 24px/1.5em Arial, Helvetica, sans-serif; 	padding:8px 0; 	margin:8px 0; 	color:#595959; } p { 	margin:8px 0; 	padding:0 0 8px 0; 	font:normal 12px/1.8em Arial, Helvetica, sans-serif; } a { 	color:#2cadff; 	text-decoration:underline; } p.spec { } p.infopost { 	line-height:30px; } a.rm { } a.com { 	text-decoration:none; 	color:#959595; } a.com span { 	color:#2cadff; 	font-weight:bold; } .header, .content, .menu_nav, .fbg, .footer, form, ol, ol li, ul, .content .mainbar, .content .sidebar { 	margin:0; 	padding:0; } .header { } .header_resize { 	margin:0 auto; 	padding:0; 	width:970px; } img.hbg_img { 	margin:0 0 8px; 	padding:7px; } .menu_nav { 	margin:0 auto 6px; 	padding:0 30px; 	height:42px; 	background-color:#2cadff; 	border:2px solid #97cbed; } .menu_nav ul { 	list-style:none; 	padding:0; 	height:42px; 	float:left; 	border-left:1px solid #6dcbff; } .menu_nav ul li { 	margin:0; 	padding:0; 	float:left; 	border-right:1px solid #6dcbff; } .menu_nav ul li a { 	display:block; 	margin:0; 	padding:10px 24px; 	color:#fff; 	text-decoration:none; 	font-size:13px; } .menu_nav ul li.active a, .menu_nav ul li a:hover { 	color:#fff; 	background-color:#48beff; } .content { } .content_resize { 	margin:0 auto; 	padding:0 0 24px; 	width:970px; 	background-color:#fff; } .content .mainbar { 	margin:0; 	padding:0; 	float:left; 	width:670px; } .content .mainbar img { 	border:1px solid #e3e5e2; 	padding:4px; 	background-color:#fff; } .content .mainbar img.fl { 	margin:4px 16px 4px 0; 	float:left; } .content .mainbar .article { 	margin:0 0 12px; 	padding:8px 24px 0 24px; } .content .sidebar { 	padding:0; 	float:right; 	width:288px; } .content .sidebar .gadget { 	margin:0 0 12px; 	padding:8px 16px 8px 24px; } ul.sb_menu, ul.ex_menu { 	margin:0; 	padding:0 0 0 16px; 	list-style:none; 	color:#959595; } ul.sb_menu li, ul.ex_menu li { 	margin:0; } ul.sb_menu li { 	padding:4px 0; 	width:220px; } ul.ex_menu li { 	padding:4px 0; } ul.sb_menu li a, ul.ex_menu li a { 	color:#959595; 	text-decoration:none; 	margin-left:-16px; 	padding:4px 8px 4px 16px; 	background:url(images/li.gif) no-repeat left center; } ul.sb_menu li a:hover, ul.ex_menu li a:hover { 	color:#2cadff; 	font-weight:bold; 	text-decoration:none; } .content p.pages { 	padding:32px 24px 12px; 	font-size:11px; 	color:#959595; 	text-align:right; } .content p.pages span, .content p.pages a:hover { 	padding:5px 10px; 	color:#fff; 	background-color:#2cadff; 	border:1px solid #2cadff; } .content p.pages a { 	padding:5px 10px; 	color:#959595; 	background-color:#fbfbfc; 	border:1px solid #edebeb; 	text-decoration:none; } .content p.pages small { 	font-size:11px; 	float:left; } .content .mainbar .comment { 	margin:0; 	padding:16px 0 0 0; } .content .mainbar .comment img.userpic { 	border:1px solid #dedede; 	margin:10px 16px 0 0; 	padding:0; 	float:left; } .fbg { } .fbg_resize { 	margin:0 auto; 	width:922px; 	padding:24px 24px 12px; 	border-top:1px solid #f0f0f0; 	border-bottom:1px solid #f0f0f0; } .fbg .c2 a, .fbg .c3 a { 	margin:0; 	padding:2px 4px; 	text-decoration:underline; } .fbg h2 { } .fbg img { 	margin:0 16px 16px 0; 	padding:3px; 	background-color:#fff; 	border:1px solid #99bece; } .fbg .col { 	margin:0; 	float:left; } .fbg .c1 { 	padding:0 16px 0 0; 	width:266px; } .fbg .c2 { 	padding:0 16px; 	width:300px; } .fbg .c3 { 	padding:0 0 0 16px; 	width:260px; } .footer { } .footer_resize { 	margin:0 auto; 	padding:12px 24px; 	width:922px; } .footer p { 	margin:0; 	padding:4px 0; 	line-height:normal; } .footer a { 	color:#959595; 	padding:inherit; 	text-decoration:underline; } .footer a:hover { 	text-decoration:none; } .footer .lf { 	float:left; } .footer .rf { 	float:right; } ol { 	list-style:none; } ol li { 	display:block; 	clear:both; } ol li label { 	display:block; 	margin:0; 	padding:16px 0 0 0; } ol li input.text { 	width:480px; 	border:1px solid #c0c0c0; 	margin:0; 	padding:5px 2px; 	height:16px; 	background-color:#fff; } ol li textarea { 	width:480px; 	border:1px solid #c0c0c0; 	margin:0; 	padding:2px; 	background-color:#fff; } ol li .send { 	margin:16px 0 0 0; } .searchform { 	float:right; 	padding:0; } #formsearch { 	margin:0; 	height:36px; 	padding:3px 0 0; 	width:232px; } #formsearch span { 	display:block; 	margin:0; 	padding:0; 	float:left; 	background:url(http://img193.imageshack.us/img193/4779/searchr.gif) no-repeat top left; } #formsearch input.editbox_search { 	margin:0; 	padding:11px 6px 10px; 	float:left; 	width:181px; 	border:none; 	background:none; 	font:normal 12px/1.5em Arial, Helvetica, sans-serif; 	color:#a8acb2; } #formsearch input.button_search { 	margin:0; 	padding:0; 	border:none; 	float:left; }

Css Plantillas!

Recursos web!

Los-Recursos - La mejor ayuda webmaster.

Webtile

Por encima de la pagina

Por debajo de la pagina

Css code sin style tags