تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3
2011-11-26, 11: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)";
}
تحياتي لكم
رد: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3
2011-11-30, 6:06 pm
فعلاطريقه جربته
وهي تعطي جماليه للازرار
طرح جميل وموفق
ودي
وهي تعطي جماليه للازرار
طرح جميل وموفق
ودي
- IMADZZفارس جديد
عدد المساهمات : 22
رد: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3
2011-12-01, 10:01 am
شكرااا
- smaعضو مؤسس
عدد المساهمات : 4300
رد: تعلم تغيير شكل أزرار و فراغات منتداك إلى مظهر أجمل عبر CSS3
2011-12-02, 11:41 pm
شكرا لك موضوع مميز
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى