ET-Tasarım | Tasarım Dünyası

Big Business

Tasarım Üstü:

Tasarım Altı:

<div class="box">
				<h2>Welcome to Big Business</h2>
				<p>
					This is <strong>Big Business</strong>, a free and fully standards-compliant CSS website template by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>. The pictures in this template are from <a href="http://pdphoto.org">PDPhoto.org</a>. This free CSS template is released under a <a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons Attributions 3.0</a> license, so you are pretty much free to do whatever you want with it (even use it commercially) provided you keep all the links in the footer intact. Aside from that, have fun with it <img src="//theme.webme.com/smiles/smiley.gif" border="0" width="15" height="15" alt="" />
				</p>
			</div>
			<div class="box" id="content-box1">
				<h3>Mauris justo</h3>
				<ul class="section-list">
					<li class="first">
						<img class="pic alignleft" src="https://img.webme.com/pic/e/et-tasarim/pic02.jpg" width="70" height="70" alt="" />
						<span>Condimentum et porttitor tristique nec aliquet magnis pretium quam nibh.</span>
					</li>
					<li>
						<img class="pic alignleft" src="https://img.webme.com/pic/e/et-tasarim/pic02.jpg" width="70" height="70" alt="" />
						<span>Posuere elementum sapien justo tortor nulla fringilla suspendisse nascetur.</span>
					</li>
					<li class="last">
						<img class="pic alignleft" src="https://img.webme.com/pic/e/et-tasarim/pic02.jpg" width="70" height="70" alt="" />
						<span>Ipsum quis vestibulum feugiat congue nunc laoreet volutpat lorem ipsum sociis.</span>
					</li>
				</ul>
			</div>
			<div class="box" id="content-box2">
				<h3>Magnis hendrerit erat</h3>
				<p>
					Neque neque ornare penatibus tristique fusce turpis. Purus sagittis euismod at ornare suscipit tempus.
				</p>
				<ul class="list">
					<li class="first"><a href="#">Ipsum phasellus ullamcorper</a></li>
					<li><a href="#">Mollis mattis tempus amet</a></li>
					<li><a href="#">Ipsum aliquet dignissim vitae</a></li>
					<li><a href="#">Orci metus curae sed mollis</a></li>
					<li class="last"><a href="#">Tristique amet venenatis</a></li>
				</ul>
			</div>
			<br class="clearfix" />
		</div>
		<div id="sidebar">
			<div class="box">
				<h3>Cursus magnis</h3>
				<ul class="list">
					<li class="first"><a href="#">Adipiscing tincidunt</a></li>
					<li><a href="#">Euismod elit sollicitudin</a></li>
					<li><a href="#">Dolor magnis et lacinia</a></li>
					<li><a href="#">Mauris ornare aenean</a></li>
					<li class="last"><a href="#">Ante semper fringilla</a></li>
				</ul>
			</div>
			<div class="box">
				<h3>Morbi at varius</h3>
				<div class="date-list">
					<ul class="list date-list">
						<li class="first"><span class="date">2/08</span> <a href="#">Quam sed tempus</a></li>
						<li><span class="date">2/05</span> <a href="#">Lorem et vestibulum</a></li>
						<li><span class="date">2/01</span> <a href="#">Risus aenean tellus</a></li>
						<li class="last"><span class="date">1/31</span> <a href="#">Tristique et primis</a></li>
					</ul>
				</div>
			</div>
		</div>
		<br class="clearfix" />
	</div>
	<div id="page-bottom">
		<div id="page-bottom-content">
			<h3>Magnis hendrerit erat</h3>
			<p>
				Euismod sodales sociis hendrerit pulvinar molestie urna. Consectetur egestas sodales at ornare laoreet turpis. Lorem id sapien ridiculus sagittis imperdiet urna suspendisse. Posuere arcu parturient quam risus. Aliquam nullam magnis integer gravida vulputate felis. Consectetur montes sollicitudin dictum. Auctor sociis hendrerit pulvinar molestie urna lorem ipsum dolor vivamus pulvinar libero. Massa egestas cubilia lacus augue mattis consectetur.
			</p>
		</div>
		<div id="page-bottom-sidebar">
			<h3>Sed interdum</h3>
			<ul class="list">
				<li class="first"><a href="#">Suspendisse ultricies</a></li>
				<li><a href="#">Tortor mollis enim</a></li>
				<li class="last"><a href="#">Lorem enim tempor</a></li>
			</ul>
		</div>
		<br class="clearfix" />
	</div>
</div>
<div id="footer">
	Copyright (c) 2012 Sitename.com. All rights reserved. Design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>.
</div>

Css Kodu:

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;}

* {
	margin: 0;
	padding: 0;
}

a {
	text-decoration: underline;
	color: #0F8C8C;
}

a:hover {
	text-decoration: none;
}

body {
	font-size: 11.5pt;
	color: #5C5B5B;
	line-height: 1.75em;
	background: #E0DCDC url(https://img.webme.com/pic/e/et-tasarim/j.gif) repeat-x top left;
}

body,input {
	font-family: Georgia, serif;
}

strong {
	color: #2C2B2B;
}

br.clearfix {
	clear: both;
}

h1,h2,h3,h4 {
	font-weight: normal;
	letter-spacing: -1px;
}

h2 {
	font-size: 2.25em;
}

h2,h3,h4 {
	color: #2C2B2B;
	margin-bottom: 1em;
}

h3 {
	font-size: 1.75em;
}

h4 {
	font-size: 1.5em;
}

img.alignleft {
	margin: 5px 20px 20px 0;
	float: left;
}

img.aligntop {
	margin: 5px 0 20px 0;
}

img.pic {
	padding: 5px;
	border: solid 1px #D4D4D4;
}

p {
	margin-bottom: 1.5em;
}

ul {
	margin-bottom: 1.5em;
}

ul h4 {
	margin-bottom: 0.35em;
}

.box {
	overflow: hidden;
	margin-bottom: 1em;
}

.date {
	background: #6E6E6E;
	padding: 5px 6px 5px 6px;
	margin: 0 6px 0 0;
	color: #FFFFFF;
	font-size: 0.8em;
	border-radius: 2px;
}

#content {
	width: 665px;
	float: left;
	padding: 0;
}

#content-box1 {
	width: 320px;
	float: left;
}

#content-box2 {
	margin: 0 0 0 345px;
	width: 320px;
}

#footer {
	margin: 40px 0 120px 0;
	text-align: center;
	color: #8C8B8B;
}

#footer a {
	color: #8C8B8B;
}

#header {
	height: 75px;
	position: relative;
	background: #6E6E6E url(https://img.webme.com/pic/e/et-tasarim/jj.jpg) top left no-repeat;
	padding: 45px;
	color: #FFFFFF;
	width: 888px;
	border: solid 1px #7E7E7E;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	overflow: hidden;
}

#logo {
	line-height: 160px;
	height: 160px;
	padding: 5px 0 0 0;
	position: absolute;
	top: 0;
	left: 45px;
}

#logo a {
	text-decoration: none;
	color: #FFFFFF;
	text-shadow: 0 1px 1px #3E3E3E;
}

#logo h1 {
	font-size: 3.25em;
}

#slogan {
	line-height: 160px;
	height: 160px;
	padding: 5px 0 0 0;
	position: absolute;
	right: 45px;
	top: 0;
}

#slogan h2 {
	color: #BEBEBE;
	font-size: 1.25em;
	text-shadow: 0 1px 1px #3E3E3E;
}

#menu {
	padding: 0 45px 0 45px;
	position: relative;
	background: #209D9D url(https://img.webme.com/pic/e/et-tasarim/img02.gif) repeat-x top left;
	margin: 0 0 0 0;
	height: 60px;
	line-height: 60px;
	width: 890px;
	border-top: solid 1px #5AD7D7;
	text-shadow: 0 1px 1px #007D7D;
}

#menu a {
	text-decoration: none;
	color: #FFFFFF;
	font-size: 1.25em;
	letter-spacing: -1px;
}

#menu ul {
	list-style: none;
}

#menu ul li {
	padding: 0 20px 0 20px;
	display: inline;
}

#menu ul li.first {
	padding-left: 0;
}

#page {
	padding: 45px 45px 15px 45px;
	position: relative;
	width: 890px;
	margin: 0;
}

#page .section-list {
	list-style: none;
	padding-left: 0;
}

#page .section-list li {
	clear: both;
	padding: 30px 0 30px 0;
}

#page ul {
	list-style: none;
}

#page ul li {
	border-top: solid 1px #D4D4D4;
	padding: 15px 0 15px 0;
}

#page ul li.first {
	padding-top: 0;
	border-top: 0;
}

#page-bottom {
	position: relative;
	margin: 0;
	background: #6E6E6E url(https://img.webme.com/pic/e/et-tasarim/jj.jpg) top left no-repeat;
	border: solid 1px #7E7E7E;
	width: 888px;
	padding: 45px 45px 0 45px;
	color: #DCDCDC;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

#page-bottom a {
	color: #F5F5F5;
}

#page-bottom h2, #page-bottom h3, #page-bottom h4 {
	color: #FFFFFF;
}

#page-bottom ul {
	list-style: none;
}

#page-bottom ul li {
	border-top: solid 1px #8F8F8F;
	padding: 15px 0 15px 0;
}

#page-bottom ul li.first {
	padding-top: 0;
	border-top: 0;
}

#page-bottom-content {
	width: 665px;
	float: left;
}

#page-bottom-sidebar {
	width: 200px;
	margin: 0 0 0 690px;
}

#search input.form-submit {
	margin-left: 1em;
	color: #FFFFFF;
	padding: 10px;
	background: #2FACAC;
	border: 0;
}

#search input.form-text {
	border: solid 1px #8F8F8F;
	padding: 10px;
}

#sidebar {
	width: 200px;
	padding: 0;
	margin: 0 0 0 690px;
}

#splash {
	margin: 0 0 0 0;
	height: 250px;
	position: relative;
	padding: 45px 45px 10px 45px;
	width: 890px;
}

#splash .pic {
	padding: 9px;
}

#wrapper {
	position: relative;
	width: 980px;
	margin: 75px auto 0 auto;
	background: #FFFFFF;
}

ET Tasarım

ET-Tasarım | Tasarım Dünyası

Big Business

Big Business

Kategoriler

Reklamlar

ET Tasarım

ET-Tasarım | Tasarım Dünyası

Big Business

Big Business

Kategoriler

Reklamlar