Buzzdungeon

flat

Flat
Nombre:
Flat
Autor:
Buzzdungeon

Tags:flatbluecss

Extra Contenido de tu <head>:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>$(document).ready(function(){
$('table[height="102"] iframe').appendTo(".adheader");
$("#webme_sky_ad").appendTo(".wcontent.ad");
});</script>

Texto sobre el diseño:

<div class="header-bar">
			<div class="container">
				<ul class="menu">
					<li class="active"><a href="#">Logo</a></li>
					<li><a href="#">Link</a></li>
					<li><a href="#">Link</a></li>
					<li><a href="#">Link</a></li>
				</ul>
			</div>
		</div>
		<div class="header">
			<div class="container">
				<h1 class="title"><a href="#">Titulo</a></h1>
				<div class="adheader"></div>
				<div class="clear"></div>
				<div class="main-menu">
					<ul class="menu">
						<li><a href="">link</a></li>
						<li><a href="">link</a></li>
						<li><a href="">link</a></li>
						<li><a href="">link</a></li>
						<li><a href="">link</a></li>
					</ul>
				</div>
			</div>
		</div>
		<div class="content container">
			<div class="grid">
				<div class="widget w3">
					<div class="wheader"><div>Titulo</div></div>
					<div class="clear"></div>
					<div class="wcontent"><div>

Texto por debajo de la página:

</div>
	</div>
			</div>
			<div class="widget w1">
				<div class="box">
					<div class="wheader"><div>Publicidad</div></div>
					<div class="clear"></div>
					<div class="wcontent ad"></div>
				</div>
				<div class="box">
					<div class="wheader"><div>Titulo</div></div>
					<div class="clear"></div>
					<div class="wcontent"><div>Hola mundo bla bla bla</div></div>
				</div>
			</div>
		</div>
<div class="footer">Diseño creado por <a href="http://buzzdungeon.es.tl" target="_BLANK">Buzzdungeon</a>.</div>
	</div>

CSS-Code sin Style Tags:

@media (min-width: 1100px) { .container{ width:1200px!important; } }
	body{
		color: #444;
		background: #e9f0f4;
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	}
	a{
		text-decoration: none;
	}
	h1,h2,h3,h4,h5,h6{
		margin: 10px 0;
	}
	h2{
		font-size: 31px;
	}
	h3{
		font-size: 25px;
	}
	hr{
		border: 0;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #fafafa;
	}
	.header-bar{
		background: #333;
		height: 40px;
	}
	.container{
		margin: 0 auto;
		width: 900px;
	}
	ul.menu{
		list-style: none;
		margin: 0;
		padding: 0;
	}
	ul.menu li{
		float: left;
	}
	.header-bar ul li a{
		color: #BEBEBE;
		display: block;
		line-height: 36px;
		padding: 0 30px;
		height: 40px;
	}
	.header-bar ul .active a{
		color: #DDD;
		background: #444;
	}
	.header{
		background: #32add6;/*http://lorempixel.com/1366/125/city/*/
		height: 125px;
	}
	h1.title{
		font-weight: normal;
		float:left;
		font-size: 36px;
		height: 50px;
		margin: 0;
		padding: 20px 0;
	}
	h1.title  a{
		color: #FEFEFE;
	}
	.main-menu{
		background: #0099CC;/*rgba(0,153,204,0.3)*/
		font-size: 14px;
		height: 35px;
	}
	.main-menu a{
		color: #EEE;
		display: block;
		height: 35px;
		line-height: 36px;
		padding: 0 30px;
	}
	.clear{
		clear: both;
	}
	.widget{
		margin: 10px 0;
	}
	.widget .wheader{
		background: #31363c;
		color: #EEE;
		height: 30px;
		width: 100%;
	}
	.widget .wheader div{
		padding: 6px;
	}
	.widget .wcontent{
		background: #fff;
		margin: 0;
		min-height: 100px;
		width: 100%;
	}
	.widget .wcontent div{
		padding: 6px;
	}
	[class*="w"]{
		float: left;
		margin-right: 2%;
	}
	[class*="w"]:last-of-type{
		margin-right: 0px;
	}
	.w1{
		width: 23.5%;
	}
	.w2{
		width: 49%;
	}
	.w3{
		width: 74.5%;
	}
	.w4{
		width: 100%;
	}
	.grid:after {
		content: "";
		display: table;
		clear: both;
	}
	button, input[type="submit"], input[type="button"]{
		border:0;
		background: #97a3a4;
		color:#f5f5f5;
		text-align: center;
		height: 30px;
		cursor:pointer;
		padding: 0 20px;
	}
	.button.green{
		background: #23c367;
	}
	.button.red{
		background: #e74a3a;
	}
	.button.blue{
		background: #32add6;
	}
	.button.orange{
		background: #ec8c1c;
	}
	.button.black{
		background: #252525;
	}
	.adheader{
		float:right;
	}
body{ margin:0; }
#webme_sky_ad{ position:relative; }
#webme_sky_ad iframe{
	display:block;
	margin:10px auto;
}
.box{
	margin-bottom:12px;
	overflow:hidden;
}
.footer{
	text-align:center;
	margin:10px 15px;
}
#webme_footer_textlink_dont_hide{
	display:block;
	text-align:center;
	color:#333;
	background:transparent;
}
table[height="102"]{ display:none; }
#pre_header {display: none;} 
#post_header {display: none;} 
#header_container {display: none;} 
lli.nav_element{display: none;} 
li.nav_element a{display: none;} 
h1#title{display: none;} 
h2#title span {display: none;} 
#title {display: none;} 
#nav_container {display:none;} 
#container + p{display:none;}

Hoy hubo 17 visitantes (127 clics a subpáginas)

Publicidad

Afiliados