یک دکمه بسازید که هنگام قرار گرفتن ماوس روی آن پسزمینهاش بهصورت نرم تغییر کند و کمی بزرگتر شود (از CSS Transitions استفاده کنید).
7.0 بازدید آخرین ویرایش در 201 روز قبل ساعت 03:07 0.0
با استفاده از خاصیت transition و حالت :hover این افکت را پیادهسازی کنید — روی background-color و transform انتقال تعریف کنید، مدت زمان (مثلاً 0.3s) و timing-function مثل ease-in-out تنظیم کنید. نکته: از transform: scale(1.05) برای بزرگتر کردن استفاده کنید تا از بازچینی (reflow) جلوگیری شود و حالت اولیه مانند background-color و transform: scale(1) را مشخص کنید؛ همچنین display: inline-block و padding مناسب برای ظاهری بهتر توصیه میشود.
توسط پژوهشگر در 201 روز قبل ساعت 03:07 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای دکمه، استفاده از transition برای تغییر همزمان background-color و transform بهصورت نرم مفید است. مقدار اولیه را با background-color و transform: scale(1) مشخص کنید و در حالت hover به transform: scale(1.05) برسید؛ از transition با مدت زمان 0.3s و easing بهصورت ease-in-out استفاده کنید. از display: inline-block و padding مناسب استفاده کنید تا ظاهر دکمه بهتری داشته باشد. برای دسترسیپذیری هم میتوانید از prefers-reduced-motion استفاده کنید تا کاربرانی که حرکت کم میخواهند تجربه بهتری داشته باشند.
گزارش