HOME   

المنتدى - دروس css - دروس البي اتش بي - قوالب CSS - دروس السيرفر - العاب فلاشيه - برامج مهمه جدا للويندوز - برنامك فك تشفير مع الشرح - 

الدروس  1  2  3  4  5  6  7 8 9 10 11 12 13 14 15 16 17 18 19 20  21 22 23 24 25  

مكتبة دروس css

 

  لمشاهدة مدونة كتوم ودروس css اضغط هنا

الدرس السابع

 

 

عنوان الدرس :كيف تعمل قائمه منسدله

 

 

بسم الله الرحمن الرحيم

اليوم درسنا مهم جدا

قائمه منسدله رائعه كالتالي

 

عند مرور الماوس على القائمه تفتح نافذه فيها قائمه روابط وبامكانك تغيير الالوان عن طريق style.css

اذا لنبدا بالدرس :

نضع الكود التالي في منطقه body

<ul id="pop">

<li><a href="#">موقع المحبين</a>

<ul>
<li><a href="#">alm7ben.com</a></li>
<li><a href="#">alm7ben.com</a></li>
<li><a href="#">alm7ben.com</a></li>
</ul>

</li>

<li><a href="#">موقع المحبين</a>

<ul>
<li><a href="#">alm7ben.com</a></li>
<li><a href="#">alm7ben.com</a></li>
<li><a href="#">alm7ben.com</a></li>
</ul>

</li>

<li><a href="#">موقع المحبين</a>

<ul>
<li><a href="#">alm7ben.com</a></li>
<li><a href="#">alm7ben.com</a></li>
<li><a href="#">alm7ben.com</a></li>
</ul>

سوف تصبح هكذا

 

ولاحظ يوجد  اربع قوائم كل قائمه فيها  ثلاث روابط

الان باقي ملف style.css نضيف الكود التالي فقط اختصرت لكم

بعد ماضفنا الكود داخل ملف style.css نروح للصفحه نضع داخل منطقه <head> كود جافا سكربت

 

 

لتحميل القائمه المنسدلة

 

اضغط هنا

 

 

 

انتهينا من الدرس شكرا لمتابعتكم

لمشاهدة مكتبة دروس css------>   هنـــا