fashionhut : Fashion « Templates « HTML / CSS

HTML / CSS » Templates » Fashion 
fashionhut
     

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Fashion Hut</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type='text/css'>
html, body, h1, h2, h3, h4, ul, li {
  margin: 0;
  padding: 0;
}
h1 img {
  display: block;
}
img {
  border: 0;
}
{
  color: #464544;
}
a:hover {
  color: #FFA405;
}
.left {
  float: left;
}
.right {
  float: right;
}
.more {
  text-align: right;
}
.clear {
  clear: both;
}

body {
  background: #504634;
  text-align: center;
  font: 11px verdana, arial, sans-serif;
  color: #695F4C;
  padding-bottom: 10px;
}

/** layout **/
#wrapper {
  text-align: left;
  margin: 37px auto;
  width: 672px;
  background: #ffffff;
  position: relative;
}

#header {
  background: #D9D1BC url(fashionhut-images/header.jpgno-repeat;
  height: 266px;
}
#logo {
  position: absolute;
  top: 12px;
  left: 300px;
  width: 170px;
  color: #52616E;
}
#logo h1 {
  font: bold 24px "arial narrow", arial, sans-serif;
}
#logo p {
  margin: 0;
  font-weight: bold;
}

#cart {
  position: absolute;
  top: 10px;
  left: 454px;
  width: 208px;
  background: #4B5360;
  width: 209px;
}
#cart-top background: url(fashionhut-images/cart_top.gifno-repeat; }
#cart-bot background: bottom left url(fashionhut-images/cart_bot.gifno-repeat; }
#cart-cart background: 9px 11px url(fashionhut-images/cart.gifno-repeat; }
#cart-cart {
  padding: 8px 8px 8px 60px;
  color: white;
}
#cart p {
  margin: 0;
}
#cart .orange {
  color: #FFB400;
  font-size: 10px;
}
#cart a {
  color: white;
  font-size: 10px;
}

#nav {
  background: #4B5360;
  position: absolute;
  top: 101px;
  left: 287px;
  width: 385px;
  padding: 9px 0;
  text-align: center;
}
#nav li {
  list-style: none;
  display: inline;
  color: #fff;
}
#nav a {
  text-decoration: none;
  color: #fff;
}
#gallery {
  position: absolute;
  top: 155px;
  left: 287px;
  width: 385px;
}
#gallery li {
  list-style: none;
  text-indent: -999px;
  float: left;
  overflow: hidden;
  height: 111px;
}
#gallery .gwomen {
  background: url(fashionhut-images/pic_1.jpgno-repeat;
  width: 127px;
}
#gallery .gkids {
  background: url(fashionhut-images/pic_2.jpgno-repeat;
  width: 130px;
}
#gallery .gmen {
  background: url(fashionhut-images/pic_3.jpgno-repeat;
  width: 128px;
}

#body {
  padding-top: 3px;
  background-color:#FFF;
}
#categories {
  float: left;
  width: 195px;
}
#seasonal, #collection {
  float: right;
  width: 474px;
  background: #D4CAB6;
  margin-bottom: 2px;
}
#seasonal .inner, #collection .inner {
  padding: 6px 12px;
}
#seasonal p, #collection p {
  margin: 0.9em 0;
}

.more a {
  font-size: 12px;
  color: #000;
  text-decoration: none;
}
.more a:hover {
  text-decoration: underline;
}

h3 {
  font: bold 14px "arial narrow", arial, sans-serif; 
  color: #1B1812;
}

h2 {
  font: 18px "arial narrow", arial, sans-serif; 
  color: #695F4C;
  padding-bottom: 10px;
}
#categories h2 {
  color: #fff;
  padding: 4px 0 5px 39px;
  background: #847A67;
}
#categories li {
  background: #D4CAB6 left url(fashionhut-images/bullet.gifno-repeat;
  border-top: 1px solid #F4EFDF;
  list-style: none;
  font-size: 12px;
  padding: 7px 0 8px 35px;
}
#categories a {
  text-decoration: none;
  color: #000000;
}
#categories a:hover {
  text-decoration: underline;
}

#collection {
  background: #D4CAB6 bottom right url(fashionhut-images/person_bg.jpgno-repeat;
}
#collection .inner {
  padding-right: 98px;
}
#minigal {
  float: right;
  width: 222px;
  margin-top: 1em;
  margin-bottom: 1em;
}
#minigal div {
  float: left;
  margin: 6px;
}
#collection ul {
  margin-left: 1.5em;
}
#collection li {
  margin: 0.2em 0;
  color: #463F32;
  font-size: 16px;
  font-weight: bold;
  font-family: "arial narrow", arial, sans-serif;
}
#collection p {
  width: 103px;
  margin-left: 1.5em;
}

#seas-one, #seas-two, #seas-three {
  height: 146px;
}

#seas-one {
  float: left;
  width: 195px;
  margin-right: 3px;
  background: url(fashionhut-images/foot_1.jpgno-repeat;
}
#seas-two {
  float: left;
  width: 249px;
  margin-right: 3px;
  background: url(fashionhut-images/foot_2.jpgno-repeat;
}
#seas-three {
  float: left;
  width: 222px;
  background: url(fashionhut-images/foot_3.jpgno-repeat;
}

#seas p {
  text-align: right;
  color: #000;
  margin: 80px 15px 0 0;
  font-size: 23px;
  font-weight: bold;
}
#seas p.date {
  margin-top: 0;
  font-size: 16px;
}

#copyright {
  text-align: center;
  font-size: 9px;
  padding: 3px;
}

</style>


</head>
<body>
<div id="wrapper">
  <div id="header">
    <div id="logo">
      <h1>Fashion Hut</h1>
      <p>Celebrity Brands</p>
    </div>
    <div id="cart">
      <div id="cart-top">
        <div id="cart-bot">
          <div id="cart-cart">
            <p>Shopping Cart</p>
            <p class="orange">Lorem ipsum dolor sit</p>
            <p><a href="http://www.free-css.com/">click here</a></p>
          </div>
        </div>
      </div>
    </div>
    <div id="nav">
      <ul>
        <li><a href="http://www.free-css.com/">MEN</a> | </li>
        <li><a href="http://www.free-css.com/">WOMEN</a> | </li>
        <li><a href="http://www.free-css.com/">GIRLS</a> | </li>
        <li><a href="http://www.free-css.com/">BOYS</a> | </li>
        <li><a href="http://www.free-css.com/">ACCESSORIES</a> | </li>
        <li><a href="http://www.free-css.com/">CONTACT US</a></li>
      </ul>
    </div>
    <div id="gallery">
      <ul>
        <li class="gwomen"><a href="http://www.free-css.com/">Women</a></li>
        <li class="gkids"><a href="http://www.free-css.com/">Kids</a></li>
        <li class="gmen"><a href="http://www.free-css.com/">Men</a></li>
      </ul>
    </div>
  </div>
  <div id="body">
    <div id="categories">
      <h2>Categories</h2>
      <ul>
        <li><a href="http://www.free-css.com/">Formal Dresses</a></li>
        <li><a href="http://www.free-css.com/">Party Dresses</a></li>
        <li><a href="http://www.free-css.com/">Summer Special</a></li>
        <li><a href="http://www.free-css.com/">Cocktail Dresses</a></li>
        <li><a href="http://www.free-css.com/">Formal Ware</a></li>
        <li><a href="http://www.free-css.com/">Winter Special</a></li>
        <li><a href="http://www.free-css.com/">Regular Ware</a></li>
        <li><a href="http://www.free-css.com/">Night Dress</a></li>
        <li><a href="http://www.free-css.com/">Sports Dress</a></li>
        <li><a href="http://www.free-css.com/">Wedding Dress</a></li>
        <li><a href="http://www.free-css.com/">Jeans</a></li>
      </ul>
    </div>
    <div id="seasonal">
      <div class="inner">
        <h2>Fashion Seasonal</h2>
        <h3>Welcome</h3>
        <p>Don't forget to check <a href="http://www.free-css.com/">free website templates</a> every day, because we add a new free website template almost daily.</p>
        <p>You can remove any link to our websites from this template you're free to use the template without linking back to us.</p>
        <p>Professionally made templates you can find them at <a href="http://www.templatebeauty.com">Template Beauty</a>.</p>
        <p>If you're having problems editing the template please don't hesitate to ask for help on <a href="http://www.free-css.com/">the forum</a>.</p>
        <p class="more"><a href="http://www.free-css.com/">more</a></p>
      </div>
    </div>
    <div id="collection">
      <div class="inner">
        <div id="minigal">
          <div><img src="fashionhut-images/pic_4.jpg" width="57" height="53" alt="Pic" /></div>
          <div><img src="fashionhut-images/pic_5.jpg" width="57" height="53" alt="Pic" /></div>
          <div><img src="fashionhut-images/pic_6.jpg" width="57" height="53" alt="Pic" /></div>
          <div><img src="fashionhut-images/pic_7.jpg" width="57" height="53" alt="Pic" /></div>
          <div><img src="fashionhut-images/pic_8.jpg" width="57" height="53" alt="Pic" /></div>
          <div><img src="fashionhut-images/pic_9.jpg" width="57" height="53" alt="Pic" /></div>
        </div>
        <h2>New Collection</h2>
        <ul>
          <li>New Arrivals</li>
          <li>50% discount</li>
        </ul>
        <p>Websites about templates on <a href="http://www.justwebtemplates.com">Just Web Templates</a>.</p>
      </div>
    </div>
    <div class="clear"> </div>
    <div id="seas">
      <div id="seas-one">
        <p>Autumn</p>
        <p class="date">2006</p>
      </div>
      <div id="seas-two">
        <p>Summer</p>
        <p class="date">2006</p>
      </div>
      <div id="seas-three">
        <p>Monsoon</p>
        <p class="date">2006</p>
      </div>
      <div class="clear"> </div>
    </div>
  </div>
  <div id="copyright">
    <p>Copyright &copy; 2007. Company name all rights reserved | designed by <a href="http://www.freewebsitetemplates.com">free website templates</a></p>
  </div>
</div>
</body>
</html>

   
    
    
    
    
  
Related examples in the same category
1.fashion-blog
2.fashion-brand
3.fashion-store
4.fashion 2
5.FashionClub
6.fashionhouse
7.fashionista
8.Celebrere
9.celebrity
10.beautiful
11.Beauty&Style
12.beauty-design
13.beauty-secrets
14.beautycompany
15.beautysalon
16.beautysecrets
17.metamorph_beauty
18.agedbeauty
19.face
20.facing
21.metamorph_middleage
22.clothes-collection
23.clothesfashion
24.metamorph_sweetlove
25.e16-fashion-club
26.freshair
27.wbfashion
28.ruby
29.shining-star
30.shopping
java2s.com  | Contact Us | Privacy Policy
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.