اضافة أزرار التحميل والمعاينة بشكل جديد ومميز

السلام عليكم ورحمة الله وبركاته أهلا بكم متابعي ومحبي مدونة |منوعات المحترف| في هذه التدوينة سنقدم لكم أفضل أزرار التحميل والمعاينة بشكل مميز وجديد , طبعا لقد بحثتم كثيرا عن طريقة وضع أزرار التحميل والمعاينة بشكل مناسب ويليق بالمدونة

انظر الشرح↡↡↡

قم بالبحث عن وسم :]]></b:skin> وضع الكود التالي فوقه

/* ازرار التحميل و المعاينة بوسطة منوعات المحترف*/ ================== ================== .btn-btn2{display:table;margin:0 auto} #wrap{margin:20px auto;text-align:center} a.btn{display:inline-block;position:relative;text-decoration:none;font-weight:100;letter-spacing:.5px;padding:10px 20px;margin:10px;color:#ff5722;font-size:16px;text-transform:uppercase;border-radius:3px;transition:all 0.3s ease-out;border:1px solid #ff5722;line-height:25px} a.btn:hover{background:rgb(236, 154, 128);color:#fff;box-shadow:inset 0 -50px 0 #ff5722} a.btn::before{color:#ff5722;display:-webkit-inline-box;content:"\f06e";font-family:fontawesome;margin:0 0 0 5px} a.btn:hover::before{color:#fff} a.btn2{display:inline-block;position:relative;text-decoration:none;font-weight:500;background:#ff5722;letter-spacing:.5px;padding:10px 20px;margin:10px;color:#fff;box-shadow:inset 0 0 0 #ff5722;font-size:16px;text-transform:uppercase;border-radius:3px;transition:all 0.3s ease-out;line-height:25px} a.btn2:hover{background:#cc4014;color:#fff;box-shadow:inset 0 -50px 0 #2a4057} a.btn2::before{color:#FFFFFF;display:-webkit-inline-box;content:"\f090";font-family:fontawesome;margin:0 0 0 5px}

ثانيا: أثناء كتابة التدوينة قم بوضع هذا الكود في HTML 

تحميل