<button class="radikalwp-btn-neon">کاوش کنید<//button>
.radikalwp-btn-neon {
padding: 12px 30px;
font-size: 16px;
font-family: inherit;
color: #22d3ee;
background: transparent;
border: 2px solid #22d3ee;
border-radius: 10px;
cursor: pointer;
transition: all .3s ease;
box-shadow: 0 0 8px rgba(34, 211, 238, .4), inset 0 0 8px rgba(34, 211, 238, .15);
}
.radikalwp-btn-neon:hover {
color: #06121a;
background: #22d3ee;
box-shadow: 0 0 24px rgba(34, 211, 238, .8), 0 0 48px rgba(34, 211, 238, .4);
}
درباره این اسنیپت
دکمه شفاف با حاشیه درخشان نئونی؛ در حالت هاور هاله نور شدیدتر میشود. مناسب وبسایتهای تکنولوژی و تیره. این دکمه برای فراخوانهای اقدام (CTA)، فرمها و ناوبری طراحی شده است. همه کلاسها با پیشوند radikalwp شروع میشوند تا با استایلهای قالب شما تداخلی پیش نیاید و راحتتر شخصیسازی شوند. انیمیشنها با GPU-friendly خواص transform و opacity ساخته شدهاند تا سرعت سایت شما تحت تأثیر قرار نگیرد.
پرسشهای متداول
بله، این کد بهصورت کاملاً رایگان برای استفاده شخصی و تجاری ارائه میشود. تنها استفاده از آن در محصولاتی که صرفاً بازفروش همین کد باشند مجاز نیست.
بله، اندازهها با واحدهای نسبی و flex/grid ساخته شدهاند و در نمایشگرهای کوچک هم درست نمایش داده میشوند. اگر عرض ثابت دیدید، میتوانید آن را با max-width برای موبایل تنظیم کنید.
خیر؛ این کد بدون کتابخانه خارجی و فقط با CSS بهینه نوشته شده و حجم آن چند کیلوبایت است. انیمیشنها روی GPU اجرا میشوند و تأثیر محسوسی بر امتیاز PageSpeed ندارد.
امتیاز شما به این محتوا
میانگین امتیاز کاربران: ۴.۵ از ۸ رأی — برای امتیازدهی وارد شوید
دیدگاهها (۰)
هنوز دیدگاهی ثبت نشده؛ اولین نفر باشید!