اعلان

صفحة خطأ ):
الصفحة التي تبحث/ي عنها غير موجودة

يمكنك محاولة كتابة كلمة البحث مضبوطه أو الضغط على الزر التالي للعودة للرئيسية

الرئيسية

7‏/10‏/2015

CSS3 أزرار مجانية 2016

أزرار CSS3 لمدونمرحبا الأصدقاء، واليوم لدي للافراج عن أزرار DIY حزمة مدون التي يتم تحويلها من أزرار DIY. تم إنشاء نسخة وورد هذا الزر اليكس من kolakube.com. إن الشيء العظيم حول هذه الأزرار (إلى جانب مظهرهم) هو أنها تم إنشاؤها مع CSS3، أحدث التكرار من لغة CSS الترميز. وهذا يعني، أي من هذه الأزرار سهلة لتخصيص. حتى إذا كان لديك فهم محدود لكيفية عمل CSS، وتغيير الألوان والأساليب في أي من هذه الأزرار هو نسيم. الأزرار وورد لديها 30 أزرار ولكن هنا لدينا فقط 24 أزرار لأن الأزرار الستة الأخيرة تعمل مع الرموز على شبكة الإنترنت الخط العادي الذي لا يعتمد مدون لذلك، وهنا يمكنك إضافة 24 أزرار DIY لبلوق الخاص بك مدون. دعونا نرى كيفية إضافة هذه الأزرار لبلوق الخاص بك.

شاهد

كود css


/* Standard Buttons */
a.standard {  border: 1px solid rgba(0, 0, 0, .2);  color: #fff;  display: inline-block;  padding: .5em .8em;  text-decoration: none;  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);  border-radius: 4px;  -moz-border-radius: 4px;  -webkit-border-radius: 4px;  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3);  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3);  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3);  }
.standard.red {  background: #c60000;  background: linear-gradient(top, #c60000 0%, #b20000 100%);  background: -moz-linear-gradient(top, #c60000 0%, #b20000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c60000), color-stop(100%, #b20000));  background: -webkit-linear-gradient(top, #c60000 0%, #b20000 100%); }
.standard.orange {  background: #f99015;  background: linear-gradient(top, #f99015 0%, #f76c0f 100%);  background: -moz-linear-gradient(top, #f99015 0%, #f76c0f 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f99015), color-stop(100%,#f76c0f));  background: -webkit-linear-gradient(top, #f99015 0%,#f76c0f 100%);  }
.standard.green {  background: #30a146;  background: linear-gradient(top, #30a146 0%, #249334 100%);  background: -moz-linear-gradient(top, #30a146 0%, #249334 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #30a146), color-stop(100%, #249334));  background: -webkit-linear-gradient(top, #30a146 0%, #249334 100%);  }
.standard.blue {  background: #16a4c8;  background: linear-gradient(top, #16a4c8 0%, #1086b6 100%);  background: -moz-linear-gradient(top, #16a4c8 0%, #1086b6 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #16a4c8), color-stop(100%, #1086b6));  background: -webkit-linear-gradient(top, #16a4c8 0%, #1086b6 100%);  }
.standard.gray {  background: #c2c2c2;  background: linear-gradient(top, #c2c2c2 0%, #aeaeae 100%);  background: -moz-linear-gradient(top, #c2c2c2 0%, #aeaeae 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c2c2c2), color-stop(100%, #aeaeae));  background: -webkit-linear-gradient(top, #c2c2c2 0%, #aeaeae 100%);  }
.standard.dark {  background: #464646;  background: linear-gradient(top, #464646 0%, #343434 100%);  background: -moz-linear-gradient(top, #464646 0%, #343434 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #464646), color-stop(100%, #343434));  background: -webkit-linear-gradient(top, #464646 0%, #343434 100%);  }
a.standard:hover { color: #fff; opacity: .5 }

لاضافة كود css ابحث فى القالب عن ]]></b:skin> ثم اضف فوقه مباشر 

كود html

<a href="http://www.YOUR-LINK-HERE.com/" class="standard red">Red Button</a>


<a href="http://www.YOUR-LINK-HERE.com/" class="standard orange">Orange Button</a>


<a href="http://www.YOUR-LINK-HERE.com/" class="standard green">Green Button</a>


<a href="http://www.YOUR-LINK-HERE.com/" class="standard blue">Blue Button</a>


<a href="http://www.YOUR-LINK-HERE.com/" class="standard gray">Gray Button</a>


<a href="http://www.YOUR-LINK-HERE.com/" class="standard dark">Dark Button</a>
اضافة كود html فى بلوجر

الذهب اللى لوحه التحكم ثم 

التخطيط 

ثم 

إضافة أداة 

:: خاتمة ::
إذا أعجبتكم الإضافة لا تبخلوا علينا من الضغط على زر لايك الفايسبوك و شكرا

ليست هناك تعليقات:

يمنع نشر التعليقات ذات الروابط الدعائية أو تعليقات بإسلوب غير لائق أو التى تحتوى على معلومات شخصية كالبريد الإلكترونى
أعتذر عن الرد على طلبات التوزيع لضيق الوقت أو التبادل الإعلانى

لتصلك إشعارات ردود هذا الموضوع على البريد الإلكترونى أضف علامة بالمربع بجوار كلمة "إعلامى"

جميع الحقوق محفوظة لــ بلوجر توب ©