المواضيع الأخيرة
أفضل 10 أعضاء في هذا الأسبوع
asadawd
 
علي الشامي
 

المتواجدون الآن ؟
ككل هناك 4 عُضو متصل حالياً :: 0 عضو مُسجل, 0 عُضو مُختفي و 4 زائر :: 2 عناكب الفهرسة في محركات البحث

لا أحد

[ مُعاينة اللائحة بأكملها ]


أكبر عدد للأعضاء المتواجدين في هذا المنتدى في نفس الوقت كان 141 بتاريخ 19/07/16, 08:08 am
احصائيات
هذا المنتدى يتوفر على 573 عُضو.
آخر عُضو مُسجل هو علي الشامي فمرحباً به.

أعضاؤنا قدموا 10185 مساهمة في هذا المنتدى في 2044 موضوع

لونك المفضل

اعلان هــــــام

استايل منتدى تقنيات الحالى للبيع لمزيد من التفاصيل مراسلة الأخ omarpop23


منتديات تقنيات :: جاليري استايلات التومبلايت والقوالب والاكواد :: 

كود css التاثير على ازرار المنتدى ووضع لها الوان مميزة

JoryAbdallah
كود css التاثير على ازرار المنتدى ووضع لها الوان مميزة

 أشكآأإل لـ آأكوآد الأزرار [button] من تحويلي

آكوآأإد css للنسخ phpbb2 & punbb & Invision

لا أطيل عليكم أتركم مع الأمثله والأكوآأإد ..~  

مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار


آألكود ~










الكود:

/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

   background-color: #e92e2e;

  border-color: #d43030;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #ee4040;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

  box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #d43030;

  }




/* كود الأزرار ------ haya.123.st -------*/













[*]مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~



[*]

[*]


الكود:
/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

   background-color: #57a957;

  border-color: #57a957;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




    background-color: #62c462;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

  box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background: #57a957;

  }

/* كود الأزرار ------ haya.123.st -------*/





[*]مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار


[*]

آألكود ~





الكود:
/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

 background-color: #269ce9;

  border-color: #269ce9;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #70b9e8;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

    box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #269ce9;

  }




/* كود الأزرار ------ haya.123.st -------*/






[*]مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~



[*]
الكود:


/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

 background-color: #ed4cd1;

  border-color: #d22ec1;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #ec69d5;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

    box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #d22ec1;

  }




/* كود الأزرار ------ haya.123.st -------*/



[*]مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~







[*]
الكود:
/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

 background-color: #ed4c7d;

  border-color: #d22e5c;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #ec698b;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

    box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #d22e68;

  }




/* كود الأزرار ------ haya.123.st -------*/



مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~


[*]
الكود:


/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

   background-color: #a457a9;

  border-color: #9957a9;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




    background-color: #8b2c96;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

  box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background: #9e57a9;

  }

/* كود الأزرار ------ haya.123.st -------*/





مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~


[*]
الكود:


/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

   background-color: #a8c508;

  border-color: #c0ce75;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #bdd051;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

  box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #a8c508;

  }

/* كود الأزرار ------ haya.123.st -------*/






[*]مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~


[*]
الكود:


/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

   background-color: #00dcd9;

  border-color: #30d2d4;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #40eee8;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

  box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #30d4d2;

  }

/* كود الأزرار ------ haya.123.st -------*/








[*]مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~



[*]
الكود:


/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

   background-color: #e9942e;

  border-color: #d48a30;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #ee9f40;

}







input[type="submit"]:active, input[type=reset]:active, .button:active {

  box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #d48a30;

  }




/* كود الأزرار ------ haya.123.st -------*/






[*]مثآأإل ~
* ملاحظه: مرر الماوس على الأزرار



آألكود ~


[*]
الكود:


/* كود الأزرار ------ haya.123.st -------*/

input[type="submit"], input[type=reset], .button {

  display: inline-block;

  margin: 0;

  margin-right: 12px;

  cursor: pointer;

  border: 1px solid #bbb;

  overflow: visible;

  color: #fff;

  padding: 5px 8px;

  font-size: 12px;

 font-family:Tahoma;

  line-height: 1.55em;

  vertical-align: middle;

  text-decoration: none;

  white-space: nowrap;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border-radius: 4px;

  -webkit-transition: all .15s linear;

  -moz-transition: all .15s linear;

  transition: all .15s linear;

  text-shadow: 1px 0 0 rgba(0,0,0,0.35);

  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.3)), to(rgba(255,255,255,0)));

  background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: -o-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

  background-image: linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));

 

   background-color: #f6863b;

  border-color: #c9743b;

}

input[type="submit"]:hover, input[type=reset]:hover, .button:hover {




  background-color: #fd954f;

}




input[type="submit"]:active, input[type=reset]:active, .button:active {

  box-shadow: 0 1px 1px rgba(0,0,0,0.35) inset;

  background-color: #df7b39;

  }

/* كود الأزرار ------ haya.123.st -------*/





[*]تضاف الاكواد بورقة css

[*]منقوووووووووووووووووول






Okay !
يعطيك العافيه عع الطرحح المميز 


JoryAbdallah
منورة ريانوا


m13
سسبيشــل
قممميل ي مبدعهه مبدعهه وربي
JoryAbdallah
منورة ياقمر


m13
avatar
عفوا الختي جميع الاكواد مكرره


JoryAbdallah
مافهمت كيف مكررة


m13
avatar
الاكواد مكرره في الموضوع حوالي 10 مرات


Black Love
كود اكثر من رآئع ششكرآ ~~♥


Mr.Yakoub
كالعادة ابداع رائع 

وطرح يستحق المتابعة

شكراً لك 

بانتظار الجديد القادم
دمت بكل خير
المصمم الليلي
سلمت الايادي الطيبة ........
في الابداع والتواصل المستمر
في نشر الجديد والمفيد
أُحييك على اختيارك الرائع والمميز..
تحياتي لك  
V.I.P
بارك الله فيك
Abdallah.BeraYda
السسلآلآم عليككم ورحمة الله وبركاته...
~يسعد ايامكك ..
ماشاءالله عليك جدا جميله المشاركه
الله يكتب أجرك ويارب تكون في موآزين اعمالك
ماقصرت على هالحضور بجد أبدعت..
جهود مبارك جزاك الله خيرا
دمت ودام عطائك
ودائما بأنتظار جديدك الشيق
لك خالص تقديري واحترامي
دمت بخير
Kagome Higurashi
السلام عليكم ورحمة الله وبركاته
ألف شكر لكَ على هذا الموضوع المميز و المعلومات القيمة
إنـجاز أكثر رائــــــع
لكن أرجو منكَ عدم التوقف عند هذا الحد
مـنتظرين ابداعتــــــك
دمتـ ودام تألقـك
تحياتــي
Mr.Abdelrhman
ty

سجل دخولك أو انشئ حساب لترك رد

تحتاج إلى أن تكون عضوا من أجل ترك الرد.

انشئ حساب

الانضمام إلى مجتمعنا من خلال إنشاء حساب جديد. من السهل


انشئ حساب جديد

تسجل دخول

هل لديك حساب بالفعل؟ لا توجد مشكلة، قم بتسجيل الدخول هنا.


تسجيل دخول