يريد الجنة ✿ الإدارََييِنّ ✿
الجنس : عدد المساهمات : 6086 نقاط : 27400 السٌّمعَة : 7 صور رمزية :
| موضوع: حصريا ( فوتر مطور لاحلى منتدي) مجاني للجميع الإثنين يناير 02, 2012 8:55 pm | |
| احب ان اقدم لكم فوتر منتدي مطور ِ الذي قمت بعمله الاحلي المنتدي المصمم بتقنية css2صورة من الفوتربالنسبة للذين يستخدمون تومبلايت عليهم التوجة ِ الي قالب overall_footerووضع الكود التالي في نهاية القالب مباشر - الكود:
-
<!-- بداية الروابط الجزء الاول --> <ul> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> </ul> <!-- نهاية الروابط الجزء الاول -->
</div> <div class="useful-box"> <h4 class="mylink-icon text-2">روابط مهمة</h4>
<!-- بداية الروابط الجزء الثاني --> <ul> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> </ul> <!-- نهاية الروابط الجزء الثاني -->
</div> <div class="useful-box"> <h4 class="mylink-icon text-3">من خدماتنا</h4>
<!-- بداية الروابط الجزء الثالث --> <ul> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> </ul> <!-- نهاية الروابط الجزء الثالث -->
</div> <div class="useful-box"> <h4 class="mylink-icon text-4">خ*****ت الاعضاء والزوار</h4>
<!-- بداية الروابط الجزء الرابع --> <ul> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> <li><a href="#">SooN</a></li> </ul>
<!-- نهاية الروابط الجزء الرابع --> ثم التوجة الي css ووضع الكود التالي - الكود:
-
ul.footertabs { list-style-image: none; list-style-type: none; margin: 0; padding: 0; } ul.footertabs li { float: left; } ul.footertabs a, ul.footertabs a:visited { background: none repeat scroll 0 0 transparent; border-left: 0 solid #575757; color: #999999; display: block; float: left; font: bold 11px tahoma; padding: 7px 10px; text-align: center; text-decoration: none; } ul.footertabs a:hover, ul.footertabs a:active, ul.footertabs a:focus ,.selected2{ background: none repeat scroll 0 0 #CCCCCC; color: #333333; -moz-border-radius-bottomleft: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; border:1px solid }
.footerWrap { height: 35px; margin: 0; padding: 13px 10px 0; } .footertabs { float: left; } .footerBox { color: #999999; direction: rtl; float: right; line-height: 20px; margin: 5px 0 0 10px; } .footerBarBG { background: url("http://[url=http://www.alrakami.com/vb/images/black_a2011/misc/images/footerBarBG.gif%22%29]www.alrakami.com/vb/images/black_a2011/misc/images/footerBarBG.gif")[/url] no-repeat scroll center top #393939; height: 58px; padding: 0; }
.footerMain { background: none repeat scroll 0 0 #252525; color: #898989; line-height: 18px; margin: 0; padding: 20px; }
#useful-links { height: 255px; position: absolute; right: 46px; top: 61px; width: 942px; } .useful-box { display: block; float: right; height: 261px; margin-left: 44px; width: 191px; } #useful-links ul { list-style-image: url("http://i45.servimg.com/u/f45/15/95/28/21/arrow10.png"); margin: 0 38px 0 0; padding: 0; } #useful-links ul li { color: #5E5E5E; margin: 0; padding: 0; } #useful-links ul li a { color: #FFFFFF; display: block; font-family: tahoma; font-size: 12px; font-weight: normal; padding: 5px 5px 5px 0; text-decoration: none; } #useful-links ul li a:hover { background: none repeat scroll 0 0 #D0D0D0; color: #616161; -moz-border-radius-bottomleft: 8px; -moz-border-radius-bottomright: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; border:1px solid #858585; } .mylink-icon { height: 40px; padding-right: 42px; } .mylink-icon1 { background: url("http://i45.servimg.com/u/f45/15/95/28/21/link110.png") no-repeat scroll right center transparent; height: 40px; padding-right: 42px; } .text-1 { background: url("http://i45.servimg.com/u/f45/15/95/28/21/text-110.png") no-repeat scroll center center transparent; overflow: hidden; text-indent: -5000px; } .text-2 { background: url("http://i45.servimg.com/u/f45/15/95/28/21/text-210.png") no-repeat scroll center center transparent; overflow: hidden; text-indent: -5000px; } .text-3 { background: url("http://i45.servimg.com/u/f45/15/95/28/21/text-310.png") no-repeat scroll center center transparent; overflow: hidden; text-indent: -5000px; } .text-4 { background: url("http://i45.servimg.com/u/f45/15/95/28/21/text-410.png") no-repeat scroll center center transparent; overflow: hidden; text-indent: -5000px; } .vb-version { bottom: 9px; color: #A1A1A1; font-family: tahoma; font-size: 12px; left: 71px; position: absolute; } .vb-version a { color: #7F7F7F; text-decoration: none; } .mtwer-copy-right { bottom: 9px; color: #A1A1A1; font-family: tahoma; font-size: 12px; position: absolute; right: 92px; } .mtwer-copy-right a { color: #7F7F7F; text-decoration: none; }
.luaytop { cursor: pointer; display: block; height: 29px; position: absolute; right: 459px; top: 5px; width: 127px; }
#footer h4 { color: #FFFFFF; margin: 0; padding: 11px 32px 0 0; }
#footer p { margin: 0; padding: 0; }
#footer { background: url("http://i45.servimg.com/u/f45/15/95/28/21/bbbbbb10.png") no-repeat scroll 0 0 transparent; clear: both; height: 384px; margin: 0 auto; position: relative; width: 984px; } | |
|