چند دکمه ی خوش رنگ

چند دکمه ی خوش رنگ

دکمه ی سبز: من خیلی خشکلم

دکمه ی آبی: من از تو خیلی خوشکل ترم

دکمه ی قرمز: من از همه خوشکل ترم

دکمه بنفش: کور خوندی داداش من قشنگترم

کد در ادامه مطلب ... 

.butn {
    color: #fff !important;
    padding: 10px 25px;
    text-decoration: none;
    display: inline-block;
    border-radius: 10px;
}
.butn.gn {
    background: linear-gradient(-70deg,#078dff,#69c1ff);
    box-shadow: 0 10px 15px -4px #2F80ED61;
}
.butn.be {
    background: linear-gradient(70deg,#F47778,#E96791);
    box-shadow: 0 10px 15px -4px #ec6b8a61;
}
.butn.rd {
    background: linear-gradient(135deg,#01e08c,#00C178);
    box-shadow: 0 5px 15px #00C17890;
}
.butn.pe {
    background: linear-gradient(135deg,#9667ea,#673ab7);
    box-shadow: 0 7px 20px #673ab755;
}

این کد رو در ویرایش css قالب فعلی بزارید سپس کلاس های انها را فراخانی کنید.

 

کلاس ها: 

<a href="" class="butn gn">دکمه ی سبز</a>
<a href="" class="butn be">دکمه ی آبی</a>
<a href="" class="butn rd">دکمه ی فرمز</a>
<a href="" class="butn pe">دکمه بنفش</a>