امروز از پرس و جوهای ظرف استفاده کنید

از زمانی که طراحی وب پاسخگو بوده است ، توسعه دهندگان در مورد امکان طراحی عناصر DOM بر اساس اندازه واقعی آنها و نه بر اساس اندازه نمایش در مرورگر (با کمک پرس و جوهای رسانه ای ) سال می کنند. در حقیقت ، پرس و جوهای کانتینری (در ابتدا پرس و جوهای عنصر) احتمالاً درخواست شده ترین عملکرد CSS هستند که مرورگرها هنوز ندارند .


در حال حاضر وجود دارد بسیاری از ، بسیاری از ، بسیاری از پست که توضیح دهد که دقیقا به همین دلیل نمایش داده شد ظرف به پیاده سازی در CSS و چرا تولید کنندگان مرورگر مردد هستند برای پیاده سازی آنها دشوار است. اگر می خواهید از آن لذت ببرید ، کمی جاوا اسکریپت می تواند به شما کمک کند:

c51c33e1533e68c3f8fd24633700789f

کل ماجرا به این شکل به نظر می رسد:

See the Pen by David Vielhuber (@vielhuber) on CodePen.

نقاط توقف ، انتخاب کننده و ویژگی های سبک را می توان برای تعریف نقاط مختلف شکست ، انتخاب کننده خودکار و نوع کلاس های اضافه شده استفاده کرد. اگر از اسکریپت استفاده می کنید ، می توانید کلاس های جدید ایجاد شده را به شرح زیر آدرس دهید:

c51c33e1533e68c3f8fd24633700789f

استفاده از پرس و جوهای کانتینر به ویژه برای عناصر روی همپوشانی ، پنجره های بازشو ، ستون های فرعی یا عناصر سفارشی - حتی در حال حاضر ، به عنوان مثال ، با اسکریپت بالا ، بسیار ارزشمند است.

بازگشت