أزرار معاينة وتحميل الإحترافية

لابد وإنك صادفت أزرار إحترافية للمعاينة والتحميل في بعض المدونات ومنها مدون محترف
وهذه الإزرار الإحترافية أقدمها لكم اليوم من مدونتي #سيف_المالكي 

يمكنكم معاينة هذه الإزرار 

• معاينة

الإن الأضافة 

نذهب إلى القالب > تحرير HTML > نضغط على CTRL+F > نبحث عن

]]></b:skin>

ونضع فوقه الكود التالي 

/*----CSS Demo Button Mudwnp----*/
.mudwnpbo,.mudwnpbb {border-radius: 10px;box-shadow: 0 0 3px 0 #000;color: #fff;display: inline-block;font: bold 15px droid arabic kufi;padding: 31px 20px;margin:15px 20px;text-align: center;transition: all 1.3s ease 0s;min-width: 55px;}
.mudwnpbo {background:#FC7400;border: 1px solid #FB4700;}
.mudwnpbb {background:#0062C4;border: 1px solid #01427F;}
.mudwnpbo:hover,.mudwnpbb:hover {background:#000;border: 1px solid #000;border-radius: 100%;color: #FFFFFF;padding: 31px 20px;}
/*----CSS Download Button Mudwnp----*/
.mudwnpbo,.mudwnpbb {border-radius: 10px;box-shadow: 0 0 3px 0 #000;color: #fff;display: inline-block;font: bold 15px droid arabic kufi;padding: 31px 20px;margin:15px 20px;text-align: center;transition: all 1.3s ease 0s;min-width: 55px;}
.mudwnpbb {background:#0062C4;border: 1px solid #01427F;}
.mudwnpbo:hover,.mudwnpbb:hover {background:#000;border: 1px solid #000;border-radius: 100%;color: #FFFFFF;padding: 31px 20px;}

الكود باللون الأحمر هو لون خلفية الزر معاينة 

الكود باللون الأزرق هو لون خلفية الزر تحميل

لأضافة الإزرار داخل التدوينة فقط ضع هذه الإكواد في تبويب HTML 

<a class="mudwnpbo" href="#" rel="nofollow" target="_blank">معاينة</a>
<a class="mudwnpbb" href="#" rel="nofollow" target="_blank">تحميل</a>