با استفاده از CSS یک تصویر پسزمینه را ماسک کنید تا فقط یک ناحیه دایرهای از وسط تصویر قابل مشاهده باشد
14.0 بازدید آخرین ویرایش در 220 روز قبل ساعت 02:16 0.0
برای حل این سوال از ویژگیهای mask-image یا -webkit-mask-image همراه با یک radial-gradient استفاده کنید تا ناحیه دایرهای مشکی (قابل دیده شدن) و بقیه قسمتها شفاف شوند؛ سپس با تنظیم mask-size، mask-position و mask-repeat شکل را در مرکز قرار دهید. برای سازگاری بهتر مرورگرها از پیشوند -webkit- استفاده کنید و اگر خواستید میتوانید به جای گرادیانت از یک تصویر ماسک با فرمت PNG استفاده کنید.
توسط پژوهشگر در 220 روز قبل ساعت 02:16 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای ماسک کردن یک تصویر پسزمینه تا فقط یک ناحیه دایرهای از مرکز دیده شود، میتوانید از mask-image با radial-gradient استفاده کنید. برای سازگاری بین مرورگرها، از -webkit-mask-image و تنظیمهای mask-size، mask-position و mask-repeat استفاده کنید تا ماسک دقیقاً در مرکز قرار بگیرد. اگر میخواهید پایداری بیشتری داشته باشید، میتوانید به جای گرادیانت از یک PNG ماسک استفاده کنید و مقادیر mask-size و position را با واحدهای responsive تنظیم کنید. در نهایت لازم است نتیجه را روی مرورگرهای مختلف آزمایش کنید چون رفتار ماسک در برخی نسخهها متفاوت است.
گزارش