فرسان الاشهار
عزيزي الزائر / عزيزتي الزائرة يرجي التكرم بتسجبل الدخول اذا كنت عضو معنا
او التسجيل ان لم تكن عضو وترغب في الانضمام الي اسرة المنتدي
سنتشرف بتسجيلك
شكرا
ادارة المنتدي


فرسان الاشهار مجاني لتطوير المواقع و لمنتديات , اشهار المنتديات , اشهار المواقع , ارشفة المنتديات , أكواد احلى منتدى , تصاميم احلى منتدى , استايلات , تصاميم مجانية , سكربتات , اعلانات, جوجل , فيس بوك , ياهو , بلوجر
 
الرئيسيةفرسان الاشهارس .و .جبحـثالتسجيلدخول

شاطر | 
 

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

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل 
كاتب الموضوعرسالة
~MeD0~
فارس جديد
فارس جديد



ذكر
عدد المساهمات : 175
العمر : 18

مُساهمةموضوع: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3   2011-11-26, 10:08 am


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

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


مثال :







الطريقة :

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

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

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

Definitions
"

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

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


رمز Code:
.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)";
}












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


رمز Code:
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)";
}

تحياتي لكم
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://shapapstar.yoo7.com/
KiNg SaMeH
عضو مؤسس
عضو مؤسس



ذكر
عدد المساهمات : 7401
العمر : 33

مُساهمةموضوع: رد: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3   2011-11-26, 7:12 pm

شكرا جزيلا لك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://diedlove.mum-forum.com/forum
لوعة الفرقا
فارس جديد
فارس جديد



انثى
عدد المساهمات : 180

مُساهمةموضوع: رد: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3   2011-11-30, 5:06 pm

فعلاطريقه جربته

وهي تعطي جماليه للازرار

طرح جميل وموفق

ودي
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.law3tfr5a.com/vb/index.php
IMADZZ
فارس جديد
فارس جديد



ذكر
عدد المساهمات : 22

مُساهمةموضوع: رد: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3   2011-12-01, 9:01 am

شكرااا
الرجوع الى أعلى الصفحة اذهب الى الأسفل
sma
عضو مؤسس
عضو مؤسس



انثى
عدد المساهمات : 4300

مُساهمةموضوع: رد: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3   2011-12-02, 10:41 pm

شكرا لك موضوع مميز


 

||
[قوانين] فرسان الاشهار العـامة
||

||
[قوانين] المشاركة بموضوع في الاقسام الاشهارية
||

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

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
فرسان الاشهار  :: اقسام الشروحات العامة :: قسم تطوير المنتديات vBulletin :: قسم تطوير المنتديات VBulletin-
انتقل الى: