#C کلید ورود به بازار کار

دوره پروژه‌محور #C و ASP.NET Core

C#
C#
مقالات برنامه نویسی
ساخت انواع دکمه دانلود

ایجاد دکمه دانلود (Download Buttons) در سایت


در این مقاله می آموزیم که چطور با استفاده از کد CSS , Html دکمه های دانلود (Download Buttons) ایجاد کنیم.


چگونه دکمه های دانلود ایجاد کنیم::


به دکمه های HTML ، دستور icon library مانند Font Awesome را اضافه کنید:


قدم اول : کد HTML را اضافه کنید.
مثال :

                                 
                

                                    
                

                                    
                
                

قدم دوم :   کد CSS را اضافه کنید.
مثال :

                               /* Style buttons */
                .btn {
                  background-color: DodgerBlue;
                  border: none;
                  color: white;
                  padding: 12px 30px;
                  cursor: pointer;
                  font-size: 20px;
                }

                /* Darker background on mouse-over */
                .btn:hover {
                  background-color: RoyalBlue;
                }
                


نمونه یک


<h2>استایل دکمه های دانلود</h2>

<p>Auto width:</p>
<button class="btn"><i class="fa fa-download"></i> دانلود</button>

<p>Full width:</p>
<button class="btn" style="width:100%"><i class="fa fa-download"></i> دانلود</button>

امتحان کنید


عکس دکمه های دانلود (Download Buttons)  

دکمه های دانلود (Download Buttons) در سایت
مقاله قبلی
آموزش اضافه کردن دکمه بارگذاری در وب سایت
مقاله بعدی
آموزش طراحی دکمه Pill Buttons در وب
نظرات شما

نظرات خود را ثبت کنید...