kodekleyin

KOD EKLEYİN Türkiye'nin en dolu Html kod ve tasarım arşivi

İstek kodlar,ve görüş bildirmek içinFORUM sayfamızı ziyaret edin...

12TK

TASARIMIN ÜSTÜNE

<head>
<title>Tools Shop</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<link rel="stylesheet" type="text/css" href="style.css" />

<script type="text/javascript" src="http://img21.xooimage.com/files/5/6/9/boxover-12985cb.js"></script>
</head>
<body>
<div id="main_container">
  <div id="header">
    <div class="top_right">
      <div class="languages">
        <div class="lang_text">Languages:</div>
        <a href="http://www.free-css.com/" class="lang"><img src="http://img25.xooimage.com/files/0/a/a/en-12985e0.gif" alt="" border="0" /></a> <a href="http://www.free-css.com/" class="lang"><img src="http://img23.xooimage.com/files/a/7/3/de-129860b.gif" alt="" border="0" /></a> </div>
      <div class="big_banner"> <a href="http://www.free-css.com/"><img src="http://img41.xooimage.com/files/5/c/2/banner728-1298616.jpg" alt="" border="0" /></a> </div>
    </div>
    <div id="logo"> <a href="http://www.free-css.com/"><img src="http://img29.xooimage.com/files/4/6/1/logo-1298623.png" alt="" border="0" width="182" height="85" /></a> </div>
  </div>
  <div id="main_content">
    <div id="menu_tab">
      <ul class="menu">
        <li><a href="http://www.free-css.com/" class="nav"> Home </a></li>
        <li class="divider"></li>
        <li><a href="http://www.free-css.com/" class="nav">Products</a></li>
        <li class="divider"></li>
        <li><a href="http://www.free-css.com/" class="nav">Specials</a></li>
        <li class="divider"></li>
        <li><a href="http://www.free-css.com/" class="nav">My account</a></li>
        <li class="divider"></li>
        <li><a href="http://www.free-css.com/" class="nav">Sign Up</a></li>
        <li class="divider"></li>
        <li><a href="http://www.free-css.com/" class="nav">Shipping </a></li>
        <li class="divider"></li>
        <li><a href="contact.html" class="nav">Contact Us</a></li>
        <li class="divider"></li>
        <li><a href="details.html" class="nav">Details</a></li>
      </ul>
    </div>
    
    <div class="crumb_navigation"> Navigation: <span class="current">Home</span> </div>
    <div class="left_content">
      <div class="title_box">Categories</div>
      <ul class="left_menu">
        <li class="odd"><a href="http://www.free-css.com/">Power Tools</a></li>
        <li class="even"><a href="http://www.free-css.com/">Air Tools</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Hand Tools</a></li>
        <li class="even"><a href="http://www.free-css.com/">Accessories</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Workwear</a></li>
        <li class="even"><a href="http://www.free-css.com/">Spare Parts</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Power Tools</a></li>
        <li class="even"><a href="http://www.free-css.com/">Air Tools</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Hand Tools</a></li>
        <li class="even"><a href="http://www.free-css.com/">Accessories</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Workwear</a></li>
        <li class="even"><a href="http://www.free-css.com/">Spare Parts</a></li>
      </ul>
      <div class="title_box">Special Products</div>
      <div class="border_box">
        <div class="product_title"><a href="http://www.free-css.com/">Makita 156 MX-VL</a></div>
        <div class="product_img"><a href="http://www.free-css.com/"><img src="http://img21.xooimage.com/files/3/d/3/p1-129863c.jpg" alt="" border="0" /></a></div>
        <div class="prod_price"><span class="reduce">350$</span> <span class="price">270$</span></div>
      </div>
      <div class="title_box">Newsletter</div>
      <div class="border_box">
        <input type="text" name="newsletter" class="newsletter_input" value="your email"/>
        <a href="http://www.free-css.com/" class="join">subscribe</a> </div>
      <div class="banner_adds"> <a href="http://www.free-css.com/"><img src="http://img41.xooimage.com/files/8/8/e/bann2-1298642.jpg" alt="" border="0" /></a> </div>
    </div>
    
    <div class="center_content">
      <div class="oferta"> <img src="http://img21.xooimage.com/files/3/d/3/p1-129863c.jpg" width="165" height="113" border="0" class="oferta_img" alt="" />
        <div class="oferta_details">
          <div class="oferta_title">Power Tools BST18XN Cordless</div>
          <div class="oferta_text"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco </div>
          <a href="http://www.free-css.com/" class="prod_buy">details</a> </div>
      </div>
      <div class="center_title_bar">Latest Products</div>

TASARIMIN ALTINA

</div>
    </div>
    
    <div class="right_content">
      <div class="title_box">Search</div>
      <div class="border_box">
        <input type="text" name="newsletter" class="newsletter_input" value="keyword"/>
        <a href="http://www.free-css.com/" class="join">search</a> </div>
      <div class="shopping_cart">
        <div class="title_box">Shopping cart</div>
        <div class="cart_details"> 3 items <br />
          <span class="border_cart"></span> Total: <span class="price">350$</span> </div>
        <div class="cart_icon"><a href="http://www.free-css.com/"><img src="http://img25.xooimage.com/files/c/7/6/shoppingcart-129866f.png" alt="" width="35" height="35" border="0" /></a></div>
      </div>
      <div class="title_box">What’s new</div>
      <div class="border_box">
        <div class="product_title"><a href="http://www.free-css.com/">Motorola 156 MX-VL</a></div>
        <div class="product_img"><a href="http://www.free-css.com/"><img src="http://img47.xooimage.com/files/6/6/6/p2-129867b.jpg" alt="" border="0" /></a></div>
        <div class="prod_price"><span class="reduce">350$</span> <span class="price">270$</span></div>
      </div>
      <div class="title_box">Manufacturers</div>
      <ul class="left_menu">
        <li class="odd"><a href="http://www.free-css.com/">Bosch</a></li>
        <li class="even"><a href="http://www.free-css.com/">Samsung</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Makita</a></li>
        <li class="even"><a href="http://www.free-css.com/">LG</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Fujitsu Siemens</a></li>
        <li class="even"><a href="http://www.free-css.com/">Motorola</a></li>
        <li class="odd"><a href="http://www.free-css.com/">Phillips</a></li>
        <li class="even"><a href="http://www.free-css.com/">Beko</a></li>
      </ul>
      <div class="banner_adds"> <a href="http://www.free-css.com/"><img src="http://img29.xooimage.com/files/4/8/5/bann1-129868a.jpg" alt="" border="0" /></a> </div>
    </div>
    
  </div>
  
  <div class="footer">
    <div class="left_footer"> <img src="images/footer_logo.png" alt="" width="89" height="42"/> </div>
    <div class="center_footer"> Template name. All Rights Reserved 2008<br />
      <a href="http://csscreme.com"><img src="http://img23.xooimage.com/files/f/b/8/csscreme-1298695.jpg" alt="csscreme" title="csscreme" border="0" /></a><br />
      <img src="http://img21.xooimage.com/files/4/5/8/payment-129869f.gif" alt="" /> </div>
    <div class="right_footer"> <a href="http://www.free-css.com/">home</a> <a href="http://www.free-css.com/">about</a> <a href="http://www.free-css.com/">sitemap</a> <a href="http://www.free-css.com/">rss</a> <a href="http://www.PwG-DesignS.es.tl/">PwG-DesignS</a> </div>
  </div>
</div>

</body>
</html>

CSS KODU

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

body
{
background:url(http://img43.xooimage.com/files/c/f/d/bg-12984fd.jpg) repeat-x #e4e9ec top;
padding:0;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
margin:0px auto auto auto;
color:#000;
}
p{
padding:2px;
margin:0px;
}
#main_container{
width:1000px;
height:auto;
margin:auto;
padding:0px;
background-color:#FFFFFF;
}
#header{
width:1000px;
height:136px;
background:url(http://img27.xooimage.com/files/4/d/3/header_bg-129850b.jpg) no-repeat center;
background-position:0px 0px;
margin:auto;
}
#logo{
float:left;
padding:45px 0 0 15px;
}
#main_content{
clear:both;
}
.languages{
float:right;
width:150px;
padding:8px 0 0 0;
}
.lang_text{
float:left;
padding:0 5px 0 0;
color:#1DA1CF;
}
a.lang{
display:block;
float:left;
padding:0 5px 0 5px;
}
.top_right{
width:728px;
float:right;
}
.big_banner{
float:right;
padding:10px 10px 0 0;
}
/*---------------- menu tab----------------------*/
#menu_tab{
width:1000px;
height:36px;
background:url(http://img27.xooimage.com/files/7/8/0/menu_bg-1298511.gif) repeat-x;
}
ul.menu {
list-style-type:none; float:left; display:block; width:982px;
margin:0px; padding:0px;background:url(http://img27.xooimage.com/files/7/8/0/menu_bg-1298511.gif) repeat-x;}

ul.menu li {
display:inline;
font-size:11px;
font-weight:bold;
line-height:36px;
}
ul.menu li.divider {
display:inline;
width:4px;
height:36px;
float:left;
background:url(http://img21.xooimage.com/files/3/7/b/menu_divider-1298523.gif) no-repeat center;
}

a.nav:link, a.nav:visited {
display:block; float:left; padding:0px 8px 0px 8px; margin:0 14px 0 14px;height:36px;text-decoration:none;color:#fff;}

a.nav:hover{
display:block; float:left; padding:0px 8px 0px 8px; margin:0 14px 0 14px;height:36px;text-decoration:none;color:#199ECD;}

/*----------------crumb_navigation-------------*/
.crumb_navigation{
width:980px;
height:15px;
padding:5px 10px 0 20px;
color:#333333;
background:url(http://img47.xooimage.com/files/1/b/4/navbullet-1298530.png) no-repeat left;
background-position:5px 8px;
}
.crumb_navigation a{
color:#0fa0dd;
text-decoration:underline;
}
span.current{
color:#0fa0dd;
}

/*-------------left_content------------------*/
.left_content{
width:180px;
float:left;
padding:0 0 0 5px;
}
.title_box{
width:180px;
height:30px;
margin:5px 0 0 0;
background:url(http://img47.xooimage.com/files/b/c/a/menu_title_bg-1298536.gif) no-repeat center;
text-align:center;
font-size:13px;
font-weight:bold;
color:#159dcc;
line-height:30px;
}
/*--------left menu---------*/
ul.left_menu{
width:180px;
padding:0px;
margin:0px;
list-style:none;
}
ul.left_menu li{
margin:0px;
list-style:none;
}
ul.left_menu li.odd a{
width:166px;height:25px;display:block; border-bottom:1px #e4e4e4 dashed;
text-decoration:none;color:#504b4b;padding:0 0 0 14px; line-height:25px;
}
ul.left_menu li.even a{
width:166px;height:25px;display:block; border-bottom:1px #e4e4e4 dashed; background-color:#f0f4f5;
text-decoration:none;color:#504b4b;padding:0 0 0 14px; line-height:25px;
}
ul.left_menu li.even a:hover, ul.left_menu li.odd a:hover{
color:#000; text-decoration:underline;
}

.border_box{
width:180px;
height:auto;
text-align:center;
background:url(images/box_bottom_bg.gif) no-repeat center bottom;
}
.product_title{
color:#ff8a00;
padding:5px 0 5px 0;
font-weight:bold;
}
.product_title a{
text-decoration:none;
color:#ff8a00;
padding:5px 0 5px 0;
font-weight:bold;
}
.product_title a:hover{
color:#064E5A;
}
.product_img{
padding:5px 0 5px 0;
}
.prod_price{
padding:5px 0 5px 0;
}
span.reduce{
color:#666666;
text-decoration:line-through;
}
span.price{
color: #ff8a00;
}
/*----------newsletter--------------*/
input.newsletter_input{
width:150px;
height:16px;
border:1px #ddd9d9 solid;
margin:10px 0 5px 0;
font-size:12px;
padding:3px;
color:#999999;
}
a.join{
width:17px;
display:block;
margin:0px 0 5px 110px;
padding:2px 8px 6px 8px;
text-decoration: underline;
color:#169ECC;
}
.banner_adds{
width:180px;
text-align:center;
padding:10px 0 10px 0;
}
/*--------------oferta------------------*/
.oferta{
width:585px;
height:156px;
background:url(http://img29.xooimage.com/files/f/9/f/slider_bg-129855f.gif) no-repeat center;
float:left;
padding:0px;
margin:0 0 5px 5px;
}
.oferta_img{
float:left;
padding:10px 0 0 10px;
}
.oferta_title{
font-size:15px;
color:#159dcc;
font-weight:bold;
}
.oferta_details{
width:340px;
float:left;
padding:20px 0 0 30px;
}
.oferta_text{
padding:5px 0 5px 0;
font-size:12px;
color:#159dcc;
text-align:justify;
line-height:15px;
}
/*center content--------------------------*/
.center_content{
width:600px;
float:left;
padding:5px 10px 5px 15px;
}
.center_title_bar{
width:575px;
height:31px;
float:left;
padding:0 0 0 10px;
margin:0 0 0 5px;
line-height:31px;
font-size:12px;
color:#159DCC;
font-weight:bold;
background:url(http://img49.xooimage.com/files/e/4/c/bar_bg-129856e.gif) no-repeat center;
}

/*----------------------right content--------------*/
.right_content{
width:180px;
float:left;
padding:0px;
}
.shopping_cart{
width:180px;
height:84px;
text-align:center;
}
.cart_title{
font-size:12px;
font-size:12px;
color:#847676;
font-weight:bold;
padding:0px;
}
.cart_details{
width:115px;
float:left;
padding:5px 0 0 15px;
text-align:left;
}
.cart_icon{
float:left;
padding:5px 0 0 5px;
}
span.border_cart{
width:100px;
height:1px;
margin:3px 0 3px 0;
display:block;
border-top:1px #999999 dashed;
}
/*---------prod_box----------*/
.prod_box{
width:173px;
height:auto;
float:left;
padding:10px 10px 10px 11px;
}
.center_prod_box{
width:173px;height: auto;float:left; text-align:center;padding:0px; margin:0px; border:1px #F0F4F5 solid;
}
.prod_details_tab{
width:173px;
height:31px;
float:left;
margin:3px 0 0 0;
}
img.left_bt{
float:left;
padding:6px 0 0 6px;
}
a.prod_details{
width:75px;
height:24px;
display:block;
float:right;
background:url(http://img29.xooimage.com/files/1/3/c/link_bg-1298575.gif) no-repeat center;
margin:2px 5px 0 0;
text-align:center;
line-height:24px;
text-decoration:none;
color:#159dcc;
}

a.prod_compare{
width:75px;
height:24px;
display:block;
float:left;
background:url(http://img29.xooimage.com/files/1/3/c/link_bg-1298575.gif) no-repeat center;
margin:2px 0 0 5px;
text-align:center;
line-height:24px;
text-decoration:none;
color:#159dcc;
}
a.prod_buy{
width:75px;
height:24px;
display:block;
float:left;
background:url(http://img29.xooimage.com/files/1/3/c/link_bg-1298575.gif) no-repeat center;
margin:2px 0 0 5px;
text-align:center;
line-height:24px;
text-decoration:none;
color: #006600;
}
/*---------prod_box_big----------*/
.prod_box_big{
width:554px;
height:auto;
float:left;
padding:10px 10px 15px 15px;
}
.center_prod_box_big{
width:554px;height: auto;float:left; text-align:center;padding:0 0 10px 0; margin:0px;border:1px #F0F4F5 solid;
}
.product_img_big{
width:170px;
padding:10px 0 0 10px;
float:left;
}
.details_big_box{
width:345px;
float:left;
padding:0 0 0 15px;
text-align:left;
}
.product_title_big{
color:#ff8a00;
padding:5px 0 5px 0;
font-weight:bold;
font-size:14px;
}
.specifications{
font-size:12px;
font-weight:bold;
line-height:18px;
}
.thumbs{
padding:8px 5px 8px 5px;
border:1px #DFD1D1 solid;
margin:15px 0 0 0;
}
.thumbs a{
padding:3px;
}
.prod_price_big{
padding:5px 0 5px 0;
font-size:16px;
}
a.addtocart{
width:76px;
height:27px;
display:block;
float:left;
background:url(images/addtocart.gif) no-repeat left;
padding:0 0 0 33px;
text-decoration:none;
line-height:27px;
color:#1c4a52;
}
a.compare{
width:76px;
height:27px;
display:block;
float:left;
margin:0 0 0 10px;
background:url(images/compare.gif) no-repeat left;
padding:0 0 0 33px;
text-decoration:none;
line-height:27px;
color:#1c4a52;
}
span.blue{
color:#159DCC;
}
/*---------------contact_form------------------*/
.contact_form{
width:355px;
float:left;
padding:0px 0 0 75px;
}
.form_row{
width:335px;
clear:both;
padding:10px 0 10px 0;
color:#a53d17;
}
label.contact{
width:75px;
float:left;
font-size:12px;
text-align:right;
padding:4px 5px 0 0;
color: #333333;
}
input.contact_input{
width:253px;
height:18px;
background-color:#fff;
color:#999999;
border:1px #DFDFDF solid;
float:left;
}
textarea.contact_textarea{
width:253px;
height:100px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color: #999999;
background-color:#fff;
border:1px #DFDFDF solid;
float:left;
}
a.contact{
width:99px;
height:27px;
display:block;
float:right;
margin:0 0 0 10px;
background:url(images/contact_bt.gif) no-repeat left;
padding:0 0 0 10px;
text-decoration:none;
line-height:27px;
color:#1c4a52;
}
/*--------------footer----------------*/
.footer{
width:1000px;
clear:both;
height:65px;
background:url(http://img43.xooimage.com/files/b/5/3/footer_bg-12985a6.gif) repeat-x top;
}
.left_footer{
float:left;
width:300px;
padding:5px 0 0 10px;
}
.right_footer{
float:right;
padding:15px 30px 0 0;
}
.right_footer a{
padding:0 0 0 7px;
text-decoration:none;
color: #666666;
}
.right_footer a:hover{
text-decoration:underline;
}

.center_footer{
float:left;
width:200px;
text-align:center;
color:#666666;
padding:10px 0 0 60px;
}

Bugün 43 ziyaretçi (65 klik) kişi burdaydı!

Bir vatanı vatan yapan üzerindeki kandır.Uğrunda kan dökülmeyen vatan,vatan değildir.

KOD EKLEYİN

KOD EKLEYİN Türkiye'nin en dolu Html kod ve tasarım arşivi

12TK

Kod Ekleyin

Kategorİler

Dost Siteler

Önemli Bilgiler

Her Telden

HTML KODLAR