منتدى الأزبار الصغيره
منتدى الأزبار الصغيره
عزيزي الزائر | يرجي التكرم بتسجبل الدخول اذا كنت عضو معنا
او التسجيل ان لم تكن عضو وترغب في الانضمام الي اسرة المنتدي التسجيل يمنحك بعض الخواص مثل تستطيع ان تضيف مواضيع وتستطيع ان تضع ردا وتستطيع ان ترى بعض الروابط والمواضيع المخفيه عن الزوار
سنتشرف بتسجيلك
شكرا
ادارة المنتدي
منتدى الأزبار الصغيره
منتدى الأزبار الصغيره
عزيزي الزائر | يرجي التكرم بتسجبل الدخول اذا كنت عضو معنا
او التسجيل ان لم تكن عضو وترغب في الانضمام الي اسرة المنتدي التسجيل يمنحك بعض الخواص مثل تستطيع ان تضيف مواضيع وتستطيع ان تضع ردا وتستطيع ان ترى بعض الروابط والمواضيع المخفيه عن الزوار
سنتشرف بتسجيلك
شكرا
ادارة المنتدي
منتدى الأزبار الصغيره
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

منتدى الأزبار الصغيره

كل ما يخص الأسره والطفل - وظائف خاليه - اشهار مواقع _ تصميم مواقع - دروس فى الكمبيوتر وبرامج 2013 الحصريه اخبار محليه وعالميه
 
الرئيسيةأحدث الصورالتسجيلدخول

 

 تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3

اذهب الى الأسفل 
كاتب الموضوعرسالة
sara

sara


عدد المساهمات : 106
انثى
تاريخ التسجيل : 19/11/2012
تاريخ الميلاد : 22/12/1988
العمر : 35
الجدي
نقاط : 4430
السٌّمعَة : 2

تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3 Empty
مُساهمةموضوع: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3   تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3 Emptyالسبت ديسمبر 08, 2012 1:39 pm

الكود متوفر له نوعان :

1-لمن يريد تطبيق الكود فقط على الأزرار .
2-لمن يريد تطبيق الكود على الأزرار و الفراغات .


مثال :

تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3 RBi65776
تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3 Szu66013

الطريقة :

1-افتح لوحة تحكم المنتدى

2-اختر من الستايل اللي تستخدمه "CSS رئيسي"

3-في نهايته يوجد مربعين كبيرين عند الخيار "تعاريف CSS الإضافية/Additional CSS

Definitions
"

4- ضع في المربع الثاني الكود التالي :

*لمن اراد التطبيق على الازرار فقط :

الكود:
.button::-moz-focus-inner{
    border:0;
}

.button:focus, .button:hover{
    outline:0;
    border-color:#999;
    -moz-box-shadow:0 0 3px #999;
    -webkit-box-shadow:0 0 3px #999;
    box-shadow:0 0 3px #999;
    cursor:pointer;
    cursor:hand;
}

.button:active{
    background-image:-moz-linear-gradient(top,#cccccc,#ffffff);
    background-image:-webkit-gradient(linear,left top,left bottom,from(#cccccc),to(#ffffff));
    filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#cccccc,endColorStr=#ffffff);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(startColorStr=#CCCCCC, endColorStr=#FFFFFF)";
}

.button{
    float:none;
    outline:none!important;
    margin:0;padding:0px 6px;
    height:25px;background-color:#f6f6f6;
    border:1px solid #ccc;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;
    background-image:-moz-linear-gradient(top,#ffffff,#efefef);
    background-image:-webkit-gradient(linear,left top,left bottom,from(#ffffff),to(#efefef));
    filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#efefef);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(startColorStr=#FFFFFF, endColorStr=#EFEFEF)";
}

* لمن اراد التطبيق على الازرار والفراغات :

الكود:

   input::-moz-focus-inner{
    border:0;
}

input:focus, input:hover{
    outline:0;
    border-color:#999;
    -moz-box-shadow:0 0 3px #999;
    -webkit-box-shadow:0 0 3px #999;
    box-shadow:0 0 3px #999;
    cursor:pointer;
    cursor:hand;
}

input:active{
    background-image:-moz-linear-gradient(top,#cccccc,#ffffff);
    background-image:-webkit-gradient(linear,left top,left bottom,from(#cccccc),to(#ffffff));
    filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#cccccc,endColorStr=#ffffff);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(startColorStr=#CCCCCC, endColorStr=#FFFFFF)";
}

input{
    float:none;
    outline:none!important;
    margin:0;padding:0px 6px;
    height:25px;background-color:#f6f6f6;
    border:1px solid #ccc;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;
    background-image:-moz-linear-gradient(top,#ffffff,#efefef);
    background-image:-webkit-gradient(linear,left top,left bottom,from(#ffffff),to(#efefef));
    filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#efefef);
    -ms-filter:"progid:DXImageTransform.Microsoft.Gradient(startColorStr=#FFFFFF, endColorStr=#EFEFEF)";
}

تحياتي لكم
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» هل تعلم لماذا يطلق عليك عضو وليس مشارك ؟؟؟؟؟
» الرئاسة تنفى تغيير جدول زيارات الرئيس الخارجية _ منتدى الأزبار الصغيره

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتدى الأزبار الصغيره :: 
أقسام منتدى الدعم والمساعده لشركه جلاكسو
 :: مشاكل في تنسيق مظهر أو تصميم أو صور أو الوان المنتدى
-
انتقل الى:  
-

منتدى الأزبار الصغيره

↑ Grab this Headline Animator

.: عدد زوار المنتدى :.

.
الساعة الأن
جميع الحقوق محفوظة لـمنتدى الأزبار الصغيره
Powered by alozbaralsger ®alozbaralsgerh.freeyemen.com
حقوق الطبع والنشر©2013 - 2012
سحابة الكلمات الدلالية
مواضيع مماثلة