|
| حصرياً كود عارضة ازرار css من AsHeK IbDa3
| |
السلام عليكم ورحمة الله تعالى وبركاته
حصرياً اعزائي فقط على منتديات فريق التطوير .. اقدم لكم كود وضع عارضة ازرار css اعلى منتداك
لن اطول عليكم
لكن أولا مفهوم بصيط لازرار السي اس اس
ازرار السي اس اس ,, هي عبارة عن ازرار .. مثلا يكون الزر في الاول لونو ابيض .. بعد مرور الماوس عليه يكون لونو ازرق مثلا !
ومعاينة توضيحية اكثر :
قبل مرور الماوس
https://i.servimg.com/u/f75/17/99/57/94/oouu_o81.png
بعد مرور الماوس
https://i.servimg.com/u/f75/17/99/57/94/oouu_o82.png
والأن وقد علمنا ما هي ازرار السي اس اس اقدم لكم الكود
أولا نبحث عن
ثم نضع بعد تماماً هذا
الكود: <style>
.top {
background-image:url('رابط خلفية العارضة');
background-repeat:repeat-x;
height:طول الخلفيةpx;
}
.menu-texe li a {
background-image:url('صور الزر قبل مرور الماوس');
color: #333333;
display: inline-block;
font-family: Tahoma,Geneva,sans-serif;
font-size: 8pt;
font-weight: bold;
height: طول الزرpx;
line-height: 32px;
margin-right: 3px;
overflow: hidden;
padding-top: 8px;
text-align: center;
text-decoration: none;
text-shadow: 0 1px 0 #ffffff;
width: 100px;
}
.menu-texe li a:hover {
background-image: url('صور الزر بعد مرور الماوس');
color: #333333;
display: inline-block;
font-family: Tahoma,Geneva,sans-serif;
font-size: 8pt;
font-weight: bold;
height:طول الزرpx;
line-height: 32px;
margin-right: 3px;
text-align: center;
text-decoration: none;
text-shadow: 0 1px 0 #ffffff;
width: 100px;
}
</style>
<div class="top">
<ul class="menu-texe">
<!-- BEGIN switch_user_logged_out -->
<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>
<!-- END switch_user_logged_out -->
<!-- BEGIN switch_user_logged_in -->
<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>
<!-- END switch_user_logged_in -->
</ul>
</div>
</body>
</html>
ملاحظة : يجب املاء الاشياء المطلوبة منك + ستلاحظ في اخر الكود ان من اول الرمز الكود: <!-- BEGIN switch_user_logged_out -->روابط تظهر للزوار ومن اول الكود: <!-- BEGIN switch_user_logged_in -->روابط تظهر للاعضاء فقط
مع تحياتي~♥
الهدية مقدمة مني ويمنع النقل بدون ذكر المصدر
---------------------
شكراً لكم
AsHeK IbDa3
أحلى منتدى
|
|
عدل سابقا من قبل AsHeK IbDa3 في الأربعاء مارس 27, 2013 4:38 am عدل 1 مرات
اخر مفاجائاتي ! (تومبلايت) حصرياً : كيفية وضع قائمة ازرار css اعلى منتداك ,, من اكتشافي >>> AsHeK IbDa3 <<<الخميس مارس 21, 2013 3:40 am