هيدر CSS احترافي

  Bài viết hay nhất1


بسم الله الرحمن الرحيم
و الصلاه و السلام على سيد المرسلين
و السلام عليكم و رحمه الله و بركاته
------------
هيدر CSS احترافي


كود
الكود:


<style type="text/css">

.top {
    background-image:url('http://im17.gulfup.com/SLs61.png');
    background-repeat:repeat-x;
    height:64px;
}

.fty {
    background-image:url('http://im26.gulfup.com/WtH11.png');
    float:left;
    width:215px;
    height:64px;
}

.h1 {
    background-image: url('http://im26.gulfup.com/42D66.png');
    background-repeat:repeat-x;
    height:249px;
   
}

.h2 {
    background-image: url('http://im26.gulfup.com/QGfz7.png');
    float:right;
    height:249px;
    width:375px;

}

.h3 {
    background-image:url('http://im26.gulfup.com/DkTc2.png');
    float:left;
    height:249px;
    width:396px;
}

.menu-texe {
    height: 57px;
    margin-right:;
    margin-top: 0;
}
.menu-texe li {
    cursor: pointer;
    float: right;
    overflow: hidden;
    padding: 0;
    padding-top:11px;
}

.long {
      float: right; 

}
.menu-texe li a {
    background-image:url('http://im26.gulfup.com/tkcH3.png');
    color: #ffffff;
    display: inline-block;
    font-family: Tahoma,Geneva,sans-serif;
    font-size: 8pt;
    font-weight: bold;
    height: 40px;
    line-height: 32px;
    margin-right: 3px;
    overflow: hidden;
    padding-top: 8px;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 0 #737373;
    width:101px;
   
}
.menu-texe li a:hover {
    background-image: url('http://im17.gulfup.com/Y5E91.png');
    color: #FFFFFF;
    display: inline-block;
    font-family: Tahoma,Geneva,sans-serif;
    font-size: 8pt;
    font-weight: bold;
    height: 40px;
    line-height: 32px;
    margin-right: 3px;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 0 #333333;
    width: 100px;
}
 body{
    padding:0;
    margin:0;
    background-position:center;
    }
    a{
    text-decoration:none;
    }



.style1 {
    text-align: center;
}


</style>
</head>

<body style="background-image: url('http://im26.gulfup.com/c4Ce8.png')">

<div class="top">

<a class="fty"></a>

<ul class="menu-texe">
 <li><a href="#">الرئيسية</a></li>
  <li><a href="#">المنتديات</a></li>
 <li><a href="#">القوانين</a></li>
 <li><a href="#">فقد كلمة السر</a></li>
 <li><a href="#">تسجيل</a></li>
 <li><a href="#">دخول</a></li>


</ul>


</div>

<div class="h1">
<div class="h2"></div>
<div class="h3"></div>
</div>

<p class="style1"><map id="FPMap0" name="FPMap0">
<area coords="209, 10, 302, 45" href="هنا%20رابط%20ما%20الجديد" shape="rect" />
<area coords="90, 9, 204, 53" href="هنا%20رابط%20مساهماتي" shape="rect" />
<area coords="28, 9, 90, 51" href="هنا%20رابط%20الخروج" shape="rect" />
<area coords="645, 9, 729, 41" href="هنا%20رابط%20التسجيل" shape="rect" />
</map>
<img alt="" height="112" src="http://im26.gulfup.com/WpWi5.png" usemap="#FPMap0" width="1000" /></p>

</body>

</html>



كود يضع في قالب الهيدر بعد كلمه
الكود:

<head>
يمنع نزع الحقوق
لاتستطيع الرد على المواضيع في هذا المنتدى