Jquery & css> : أزرار الفيس بوك بين أيديك الآن

السلام عليكم ورحمة الله و بركاته

أما بعد ,,

موضوعنا اليوم عبارة عن تحويل أزرار المنتدى لتصير مشابهة لأزرار الموقع الاجتماعي الشهير فيس بوك


قبل البدء في اجراء التغييرات نـأتي أولا للمعاينة في الصورة التالية






~ نأتي لطريقة التركيب كالتالي :

باختيارك الشكل الأخضر للأزرار يكفيك اضافة الكود التالي في CSS في الاستايل المراد تركيب التغيير عليه :

.button{
width:100px;
border:solid #3b6e22 1px;
border-bottom:solid #2c5115 1px;
cursor:pointer;
}

.button{
padding:6px 0 6px 0;
background-color:#68a64c;
border-top:solid #98c286 1px;
text-align:center;
color:#ffffff;
}

.button:active{
background-color:#609946;
} 

أما للشكل الأزرق قم بوضع الكود التالي :

.button{
width:100px;
border:solid #29447e 1px;
border-bottom:solid #1a356e 1px;
cursor:pointer;
}

.button{
padding:6px 0 6px 0;
background-color:#5c75a9;
border-top:solid #8a9cc2 1px;
text-align:center;
color:#ffffff;
}

.button:active{
background-color:#4f6aa3;
}

تحياتي لكم ~ أخوكم أشـرف آلمغربي ـ واشرف المصري منقول للافادة