WorderExpress

wellformed

Önizleme:

.title
	{
		margin-bottom: 2em;
	}

.title h2
	{
		letter-spacing: 0.10em;
		text-transform: uppercase;
		font-weight: 700;
		font-size: 2em;
		color: #FFF;
	}
	
	.title .byline
	{
		color: #6F6F6F;
	}

/*********************************************************************************/
/* Image Style                                                                   */
/*********************************************************************************/

.image
	{
		display: inline-block;
	}
	
	.image img
	{
		display: block;
		width: 100%;
	}
	
	.image-full
	{
		display: block;
		width: 100%;
		margin: 0 0 2em 0;
	}
	
	.image-left
	{
		float: left;
		margin: 0 2em 2em 0;
	}
	
	.image-centered
	{
		display: block;
		margin: 0 0 2em 0;
	}
	
	.image-centered img
	{
		margin: 0 auto;
		width: auto;
	}

/*********************************************************************************/
/* List Styles                                                                   */
/*********************************************************************************/

ul.style1 {
		margin: 0px;
		padding: 0px;
		list-style: none;
	}
	
	ul.style1 li {
		padding: 10px 0px 15px 0px;
		border-top: 1px solid #363636;
	}
	
	ul.style1 a {
		text-decoration: none;
		color: #919191;
	}
	
	ul.style1 a:hover {
		text-decoration: underline;
	}
	
	ul.style1 .first {
		padding-top: 0px;
		border-top: none;
	}

ul.style2 {
		margin: 0px;
		padding: 0px;
		list-style: none;
	}
	
	ul.style2 li {
		padding: 25px 0px 15px 0px;
		border-top: 1px solid #363636;
	}
	
	ul.style2 .first {
		padding-top: 0px;
		border-top: none;
	}
	
	ul.style2 h3 {
		padding: 0px 0px 10px 0px;
		letter-spacing: 0.10em;
	}
	
	ul.style2 h3 a {
		color: #FFF;
	}
	
	ul.style2 a {
		text-decoration: none;
		color: #919191;
	}
	
	ul.style2 a:hover {
		text-decoration: underline;
	}

/*********************************************************************************/
/* Social Icon Styles                                                            */
/*********************************************************************************/

ul.contact
	{
		margin: 0;
		padding: 2em 0em 0em 0em;
		list-style: none;
	}
	
	ul.contact li
	{
		display: inline-block;
		padding: 0em 0.30em;
		font-size: 1em;
	}
	
	ul.contact li span
	{
		display: none;
		margin: 0;
		padding: 0;
	}
	
	ul.contact li a
	{
		color: #FFF;
	}
	
	ul.contact li a:before
	{
		display: inline-block;
		background: #3f3f3f;
		width: 40px;
		height: 40px;
		line-height: 40px;
		border-radius: 20px;
		text-align: center;
		color: #FFFFFF;
	}
	
	ul.contact li a.icon-twitter:before { background: #2DAAE4; }
	ul.contact li a.icon-facebook:before { background: #39599F; }
	ul.contact li a.icon-dribbble:before { background: #C4376B;	}
	ul.contact li a.icon-tumblr:before { background: #31516A; }
	ul.contact li a.icon-rss:before { background: #F2600B; }

/*********************************************************************************/
/* Button Style                                                                  */
/*********************************************************************************/

.button
	{
		display: inline-block;
		margin-top: 2em;
		background: #BC1414;
		border-radius: 5px;
		line-height: 4em;
		padding: 0 3em;
		-webkit-transition: all .25s ease-in-out;
		-moz-transition: all .25s ease-in-out;
		-ms-transition: all .25s ease-in-out;
		-o-transition: all .25s ease-in-out;
		transition: all .25s ease-in-out;
		letter-spacing: 0.25em;
		text-decoration: none;
		text-transform: uppercase;
		outline: 0;
		white-space: nowrap;
		font-family: 'Open Sans Condensed', sans-serif;
		font-weight: 700;
		font-size: 0.80em !important;
		color: #fff !important;
	}

.button:hover
		{
			background: #BB1717;
			-webkit-transition: all .25s ease-in-out;
			-moz-transition: all .25s ease-in-out;
			-ms-transition: all .25s ease-in-out;
			-o-transition: all .25s ease-in-out;
			transition: all .25s ease-in-out;
		}
		
		.button:active
		{
			background: #B41313;
			-webkit-transition: all .25s ease-in-out;
			-moz-transition: all .25s ease-in-out;
			-ms-transition: all .25s ease-in-out;
			-o-transition: all .25s ease-in-out;
			transition: all .25s ease-in-out;
		}
		
/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/

#header
	{
	}

/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/

#logo
	{
		padding: 3em 0em;
		text-transform: uppercase;
	}
	
	#logo h1 a
	{
		text-decoration: none;
		font-size: 1.5em;
		color: #FFF;
	}
	
	#logo span
	{
		color: #BC1414;
	}
	
	#logo p
	{
		margin: 0;
		padding: 0;
		letter-spacing: 0.10em;
		font-size: 0.90em;
	}

#logo p a
	{
		text-decoration: none;
	}

/*********************************************************************************/
/* Menu                                                                          */
/*********************************************************************************/

#menu
	{
		background: #1B1B1B url(images/bg01.png) repeat;
		border-bottom: 4px solid #BC1414;
	}
	
	#menu ul
	{
		margin: 0;
		padding: 0px 0px 0px 0px;
		list-style: none;
		line-height: normal;
		text-align: center;
	}
	
	#menu li
	{
		display: inline-block;
	}
	
	#menu a
	{
		display: block;
		padding: 0em 2em;
		line-height: 80px;
		letter-spacing: 1px;
		text-decoration: none;
		text-transform: uppercase;
		font-size: 1em;
		font-weight: 700;
		color: #838383;
	}
	
	#menu .current_page_item a
	{
		background: #BC1414;
		color: #FFF;
	}
	
	#menu a:hover
	{
		text-decoration: none;
		color: #FFF;
	}

/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/

#banner
	{
		margin: 2em auto;
	}

/*********************************************************************************/
/* Page                                                                          */
/*********************************************************************************/

#page
	{
		overflow: hidden;
		padding: 3em 0em;
		border-bottom: 1px solid #363636;
	}

/*********************************************************************************/
/* Content                                                                       */
/*********************************************************************************/

#content
	{
		float: left;
		width: 800px;
	}

/*********************************************************************************/
/* Sidebar                                                                       */
/*********************************************************************************/

#sidebar
	{
		float: right;
		width: 300px;
	}
	
	#sidebar .title
	{
		letter-spacing: 0.10em;
		text-transform: uppercase;
		color: #FFF;
	}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

#footer {
		overflow: hidden;
		padding: 6em 0em 4em 0em;
		border-bottom: 1px solid #363636;
	}
	
	#footer .title
	{
		letter-spacing: 0.10em;
		text-transform: uppercase;
		color: #FFF;
	}

#footer #fbox1 {
		float: left;
		width: 400px;
		margin-right: 50px;
	}
	
	#footer #fbox2 {
		float: left;
		width: 400px;
	}
	
	#footer #fbox3 {
		float: right;
		width: 300px;
	}

/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/

#copyright
	{
		padding: 6em 0em;
		font-size: 0.75em;
		letter-spacing: 0.20em;
		text-align: center;
		text-transform: uppercase;
		color: #6A6A6A;
	}
	
	#copyright a
	{
		color: #747474;
	}

/*********************************************************************************/
/* Three Columns                                                                 */
/*********************************************************************************/

#three-column
	{
		overflow: hidden;
		margin-bottom: 2em;
		background: #FFF;
		border-bottom: 4px solid #BC1414;
		color: #525252;
	}
	
	#three-column h2
	{
		margin: 1em 0em;
		text-transform: uppercase;
		font-size: 1.5em;
		font-weight: 700;
		color: #454445;
	}
	
	#three-column #tbox1,
	#three-column #tbox2,
	#three-column #tbox3
	{
		float: left;
		width: 300px;
		padding: 50px 50px 80px 50px;
	}
</style>
<div id="logo" class="container">
	<h1><a href="#">Well<span>Formed</span></a></h1>
	<p>Template Design by <a href="http://www.freecsstemplates.org">FreeCSSTemplates.org</a></p>
</div>
<div id="menu" class="container">
	<ul>
		<li class="current_page_item"><a href="#" accesskey="1" title="">Homepage</a></li>
		<li><a href="#" accesskey="1" title="">Services</a></li>
		<li><a href="#" accesskey="2" title="">Our Clients</a></li>
		<li><a href="#" accesskey="3" title="">About Us</a></li>
		<li><a href="#" accesskey="4" title="">Careers</a></li>
		<li><a href="#" accesskey="5" title="">Contact Us</a></li>
	</ul>
</div>
<div id="banner" class="container"> <img src="https://img.webme.com/pic/w/worderexpress/wellformed_pic01.jpg" width="1200" height="500" alt="" /></div>
<div id="three-column" class="container">
	<div id="tbox1">
		<h2>Maecenas luctus</h2>
		<p>Nullam non wisi a sem semper eleifend. Donec mattis libero eget urna. Duis pretium velit ac mauris. Proin eu wisi suscipit nulla suscipit interdum.</p>
		<a href="#" class="button">Learn More</a> </div>
	<div id="tbox2">
		<h2>Integer gravida</h2>
		<p>Proin eu wisi suscipit nulla suscipit interdum. Nullam non wisi a sem semper eleifend. Donec mattis libero eget urna. Duis pretium velit ac mauris.</p>
		<a href="#" class="button">Learn More</a> </div>
	<div id="tbox3">
		<h2>Praesent scelerisque</h2>
		<p>Donec mattis libero eget urna. Duis pretium velit ac mauris. Proin eu wisi suscipit nulla suscipit interdum. Nullam non wisi a sem semper eleifend.</p>
		<a href="#" class="button">Learn More</a> </div>
</div>
<div id="page" class="container">
	<div id="content">
		<div class="title">
			<h2>Welcome <span class="byline">to our website</span></h2>
		</div>
		<a href="#" class="image image-full"><img src="https://img.webme.com/pic/w/worderexpress/wellformed_pic02.jpg" alt="" /></a>
		<p>SAYFA İÇERİĞİ BURAYA GELECEKTİR.<br />This is <strong>WellFormed</strong>, a free, fully standards-compliant CSS template designed by <a href="http://www.freecsstemplates.org/" rel="nofollow">FreeCSSTemplates.org</a>. The photos in this template are from <a href="http://fotogrph.com/"> Fotogrph</a>. This free 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 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 id="sidebar">
		<h2 class="title">Mauris vulputate</h2>
		<ul class="style2">
			<li class="first">
				<h3><a href="#">Maecenas luctus lectus</a></h3>
				<p><a href="#">Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh.</a></p>
			</li>
			<li>
				<h3><a href="#">Integer gravida nibh</a></h3>
				<p><a href="#">Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh.</a></p>
			</li>
			<li>
				<h3><a href="#">Nulla luctus eleifend</a></h3>
				<p><a href="#">Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh.</a></p>
			</li>
		</ul>
	</div>
</div>
<div id="footer" class="container">
	<div id="fbox1">
		<h2 class="title">Praesent mattis</h2>
		<p>Pellentesque viverra vulputate enim. Aliquam erat volutpat. Pellentesque tristique ante ut risus. Quisque dictum. Integer nisl risus, sagittis convallis, rutrum id, elementum congue, nibh. Suspendisse dictum porta lectus. </p>
		<a href="#" class="button">Learn More</a> </div>
	<div id="fbox2">
		<h2 class="title">Praesent condimentum</h2>
		<ul class="style1">
			<li class="first"><a href="#">Pellentesque consectetuer gravida blandit.</a></li>
			<li><a href="#">Lorem consectetuer adipiscing elit.</a></li>
			<li><a href="#">Maecenas vitae vitae feugiat eleifend.</a></li>
		</ul>
		<a href="#" class="button">Learn More</a> </div>
	<div id="fbox3">
		<h2 class="title">Social</h2>
		<ul class="style1">
			<li class="first"><a href="#">Twitter</a></li>
			<li><a href="#">Facebook</a></li>
			<li><a href="#">Flickr</a></li>
			<li><a href="#">Google +</a></li>
		</ul>
	</div>
</div>
<div id="copyright" class="container">
	<p>Copyright (c) 2013 Sitename.com. All rights reserved. | Photos by <a href="http://fotogrph.com/">Fotogrph</a> | Design by <a href="http://www.freecsstemplates.org/" rel="nofollow">FreeCSSTemplates.org</a>.</p>
</div>

Kod:

Tasarımın Üstü;

<div id="logo" class="container">
	<h1><a href="#">Well<span>Formed</span></a></h1>
	<p>Template Design by <a href="http://www.freecsstemplates.org">FreeCSSTemplates.org</a></p>
</div>
<div id="menu" class="container">
	<ul>
		<li class="current_page_item"><a href="#" accesskey="1" title="">Homepage</a></li>
		<li><a href="#" accesskey="1" title="">Services</a></li>
		<li><a href="#" accesskey="2" title="">Our Clients</a></li>
		<li><a href="#" accesskey="3" title="">About Us</a></li>
		<li><a href="#" accesskey="4" title="">Careers</a></li>
		<li><a href="#" accesskey="5" title="">Contact Us</a></li>
	</ul>
</div>
<div id="banner" class="container"> <img src="https://img.webme.com/pic/w/worderexpress/wellformed_pic01.jpg" width="1200" height="500" alt="" /></div>
<div id="three-column" class="container">
	<div id="tbox1">
		<h2>Maecenas luctus</h2>
		<p>Nullam non wisi a sem semper eleifend. Donec mattis libero eget urna. Duis pretium velit ac mauris. Proin eu wisi suscipit nulla suscipit interdum.</p>
		<a href="#" class="button">Learn More</a> </div>
	<div id="tbox2">
		<h2>Integer gravida</h2>
		<p>Proin eu wisi suscipit nulla suscipit interdum. Nullam non wisi a sem semper eleifend. Donec mattis libero eget urna. Duis pretium velit ac mauris.</p>
		<a href="#" class="button">Learn More</a> </div>
	<div id="tbox3">
		<h2>Praesent scelerisque</h2>
		<p>Donec mattis libero eget urna. Duis pretium velit ac mauris. Proin eu wisi suscipit nulla suscipit interdum. Nullam non wisi a sem semper eleifend.</p>
		<a href="#" class="button">Learn More</a> </div>
</div>
<div id="page" class="container">
	<div id="content">
		<div class="title">
			<h2>Welcome <span class="byline">to our website</span></h2>
		</div>
		<a href="#" class="image image-full"><img src="https://img.webme.com/pic/w/worderexpress/wellformed_pic02.jpg" alt="" /></a>
		<p>

Tasarımın Altı

</p>
	</div>
	<div id="sidebar">
		<h2 class="title">Mauris vulputate</h2>
		<ul class="style2">
			<li class="first">
				<h3><a href="#">Maecenas luctus lectus</a></h3>
				<p><a href="#">Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh.</a></p>
			</li>
			<li>
				<h3><a href="#">Integer gravida nibh</a></h3>
				<p><a href="#">Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh.</a></p>
			</li>
			<li>
				<h3><a href="#">Nulla luctus eleifend</a></h3>
				<p><a href="#">Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh.</a></p>
			</li>
		</ul>
	</div>
</div>
<div id="footer" class="container">
	<div id="fbox1">
		<h2 class="title">Praesent mattis</h2>
		<p>Pellentesque viverra vulputate enim. Aliquam erat volutpat. Pellentesque tristique ante ut risus. Quisque dictum. Integer nisl risus, sagittis convallis, rutrum id, elementum congue, nibh. Suspendisse dictum porta lectus. </p>
		<a href="#" class="button">Learn More</a> </div>
	<div id="fbox2">
		<h2 class="title">Praesent condimentum</h2>
		<ul class="style1">
			<li class="first"><a href="#">Pellentesque consectetuer gravida blandit.</a></li>
			<li><a href="#">Lorem consectetuer adipiscing elit.</a></li>
			<li><a href="#">Maecenas vitae vitae feugiat eleifend.</a></li>
		</ul>
		<a href="#" class="button">Learn More</a> </div>
	<div id="fbox3">
		<h2 class="title">Social</h2>
		<ul class="style1">
			<li class="first"><a href="#">Twitter</a></li>
			<li><a href="#">Facebook</a></li>
			<li><a href="#">Flickr</a></li>
			<li><a href="#">Google +</a></li>
		</ul>
	</div>
</div>
<div id="copyright" class="container">
	<p>Copyright (c) 2013 Sitename.com. All rights reserved. | Photos by <a href="http://fotogrph.com/">Fotogrph</a> | Design by <a href="http://www.freecsstemplates.org/" rel="nofollow">FreeCSSTemplates.org</a>.</p>
</div>

CSS kısmı

html, body
	{
		height: 100%;
	}
	
	body
	{
		margin: 0px;
		padding: 0px;
		background: #282828 url(https://img.webme.com/pic/w/worderexpress/wellformed_bg01.png) repeat;
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 12pt;
		font-weight: 400;
		color: #919191;
	}
	
	
	h1, h2, h3
	{
		margin: 0;
		padding: 0;
	}
	
	p, ol, ul
	{
		margin-top: 0;
	}
	
	ol, ul
	{
		padding: 0;
		list-style: none;
	}
	
	p
	{
		line-height: 180%;
	}
	
	strong
	{
	}
	
	a
	{
		color: #747474;
	}
	
	a:hover
	{
		text-decoration: none;
	}
	
	.container
	{
		margin: 0px auto;
		width: 1200px;
	}
	
/*********************************************************************************/
/* Heading Titles                                                                */
/*********************************************************************************/

.title
	{
		margin-bottom: 2em;
	}

.title h2
	{
		letter-spacing: 0.10em;
		text-transform: uppercase;
		font-weight: 700;
		font-size: 2em;
		color: #FFF;
	}
	
	.title .byline
	{
		color: #6F6F6F;
	}

#header
	{
	}

#logo p a
	{
		text-decoration: none;
	}

#banner
	{
		margin: 2em auto;
	}

#page
	{
		overflow: hidden;
		padding: 3em 0em;
		border-bottom: 1px solid #363636;
	}

#content
	{
		float: left;
		width: 800px;
	}

#sidebar
	{
		float: right;
		width: 300px;
	}
	
	#sidebar .title
	{
		letter-spacing: 0.10em;
		text-transform: uppercase;
		color: #FFF;
	}

#footer {
		overflow: hidden;
		padding: 6em 0em 4em 0em;
		border-bottom: 1px solid #363636;
	}
	
	#footer .title
	{
		letter-spacing: 0.10em;
		text-transform: uppercase;
		color: #FFF;
	}

#footer #fbox1 {
		float: left;
		width: 400px;
		margin-right: 50px;
	}
	
	#footer #fbox2 {
		float: left;
		width: 400px;
	}
	
	#footer #fbox3 {
		float: right;
		width: 300px;
	}

#copyright
	{
		padding: 6em 0em;
		font-size: 0.75em;
		letter-spacing: 0.20em;
		text-align: center;
		text-transform: uppercase;
		color: #6A6A6A;
	}
	
	#copyright a
	{
		color: #747474;
	}

Yeni Eklenen Sayfalar

En son eklenen sayfaları burada bulabilirsiniz.

ŞUBAT08

Tasarım: wellformed

Önizleme...Devamını Oku -->
ŞUBAT08

Tasarım: complete

Önizleme...Devamını Oku -->
OCAK26

Tasarım: redmarket

Önizleme...Devamını Oku -->
OCAK26

Tasarım: skycolored

Önizleme...Devamını Oku -->
OCAK26

Değişen Sayfa Title Kodu

Önizleme: Bu sitenin title'ında uygulanmaktadır...Devamını Oku -->

COPYRIGHT (c) 2014 - 2014 worderexpress.tr.gg. Tüm hakları saklıdır.Tasarım FreeCSSTemplates.org'a aittir. | Fotoğraflar Fotogrph'a aittir. Bu gün 1 (1 tık) kişi buradaydı! Şu ana kadar 6714 (11104 tık) kişi bu sayfayı ziyaret etti.

Toplist - Yan Bağlantılar

wellformed

WorderExpress

wellformed

Yeni Eklenen Sayfalar

Tasarım: wellformed

Tasarım: complete

Tasarım: redmarket

Tasarım: skycolored

Değişen Sayfa Title Kodu