آزمایشگاه پرس و جوی کانتینر iShadeed

احمد شادید یک جهش اولیه در پرس و جوهای کانتینر داشت و یک مجموعه رو به رشد نمونه ها بر اساس الگوهای روزمره

و اگر آن را از دست دادید، او آخرین پست در مورد درخواست های کانتینر از زمان ورود به Chrome 105 در این ماه، نحوه عملکرد آنها را پوشش می دهد (به زودی آنها را در Safari 16 خواهیم دید). برخی از نکات برجسته و پیشنهادی انتخابی:

• ظروف با تعریف شده است container-type ویژگی. دموها و پیشنهادات قبلی استفاده شده بود contain به جای آن.
• پرس و جوهای کانتینر بسیار شبیه پرس و جوهای رسانه ای هستند که ما در طول این مدت برای هدف قرار دادن اندازه ویوپورت نوشته ایم. بنابراین، به جای چیزی شبیه به @media (min-width: 600px) {}، ما داریم @container (min-width: 600px) {}. این باید تبدیل بسیاری از آن پرسش‌های رسانه‌ای به پرس‌وجوهای کانتینری را نسبتاً ساده کند، منهای کار تعیین مقادیر جدید نقطه شکست.
• می‌توانیم کانتینرها را نام‌گذاری کنیم تا به تشخیص آنها در کدمان کمک کنیم (مثلاً container-name: blockquote).

کار عالی احمد و با تشکر برای به اشتراک گذاری!

لینک مستقیم →