تصفّح كل وحدة CSS — مطلقة (px، cm، pt)، نسبية للخط (em، rem، ch)، نافذة العرض (vw، dvh)، استعلام الحاوية، الشبكة (fr)، الزاوية والزمن والدقة — في مرجع قابل للبحث والتصفية حسب النوع مع وصف وملاحظة "متى تستخدم" ورموز جاهزة للنسخ. في متصفحك، مجاناً.

كل وحدة CSS، مشروحة. كل شيء يعمل في متصفحك من مرجع مدمج — لا يُرسَل شيء إلى الخادم.

لا توجد وحدة تطابق بحثك.
جرّب وحدة أو فئة مختلفة — مثل rem أو dvh أو fr أو angle.

حول مرجع وحدات CSS

يوثّق مرجع وحدات CSS كل وحدة تقدمها اللغة - 45 وحدة إجمالاً - منظَّمة حسب النوع: وحدات مطلقة مثل px وcm وpt؛ ووحدات نسبية للخط مثل em وrem وch وlh؛ ووحدات منفذ العرض من vw وvh حتى الأحدث svh وlvh وdvh؛ ووحدات استعلام الحاوية مثل cqw وcqi؛ ووحدة الشبكة fr؛ إضافة إلى الزاوية والزمن والدقة والنسبة المئوية.

تمنحك كل بطاقة أكثر من مجرد تعريف: رمز الوحدة بخط أحادي المسافة قابل للنسخ، واسمها الكامل، وفئتها، ووصفاً بلغة بسيطة لكيفية حسابها، وملاحظة عملية "متى تُستخدم" تحدد أين تكسب الوحدة مكانها - وأين تخدم وحدة أخرى بشكل أفضل.

يطابق البحث الرموز والأسماء والمعاني، بحيث تجد rem وviewport width وroot جميعها وحداتها، وتصفّي شرائح النوع الشبكة إلى عائلة واحدة. كل شيء يعمل داخل متصفحك من مرجع مدمج، دون إرسال شيء إلى خادم.

كيفية استخدام مرجع وحدات CSS

  1. ابحث عن وحدة بالرمز، أو الاسم، أو المعنى - مثلاً rem أو viewport width أو angle.
  2. استخدم شرائح النوع لتصفية الشبكة إلى وحدات مطلقة أو نسبية للخط أو منفذ عرض أو حاوية أو شبكة أو زاوية أو زمن أو دقة أو نسبة مئوية.
  3. اقرأ وصف كل وحدة وملاحظة "متى تُستخدم" لاختيار الوحدة الصحيحة.
  4. انقر زر النسخ لالتقاط رمز الوحدة لورقة الأنماط الخاصة بك.

الأسئلة الشائعة

استخدم rem لأحجام الخط ولأي شيء يجب أن يتناسب مع حجم النص المُفضَّل لدى المستخدم - تتبع rem حجم خط الجذر، لذا تعمل إعدادات إمكانية الوصول في المتصفح. استخدم px للأشياء التي يجب أن تبقى ثابتة بصرياً، مثل الحدود الشعرية.

em نسبية لحجم خط العنصر الحالي نفسه، لذا تتراكم العناصر المُتداخلة القيمة؛ أما rem فهي دائماً نسبية للعنصر الجذر، ما يمنح نتائج متوقعة. لهذا أصبحت rem الاختيار الافتراضي للتباعد ومقاييس الخط.

تُظهر متصفحات الجوال وتُخفي أشرطة أدواتها، ما يغيّر الارتفاع المرئي، بينما تبقى vh ثابتة على حجم التخطيط الأكبر. تتبع الوحدة الديناميكية dvh الارتفاع المرئي الفعلي مع تحرك أشرطة الأدوات، وتثبّت svh وlvh عند الحالتين الأصغر والأكبر.

توزّع fr المساحة الحرة لحاوية الشبكة بالكسور: grid-template-columns: 2fr 1fr تمنح العمود الأول ضعف العرض المتبقي للعمود الثاني، بعد طرح المسارات الثابتة والفجوات. توجد فقط داخل تعريفات مسار الشبكة.

تُحجّم العناصر بالنسبة إلى أقرب حاوية استعلام لها بدلاً من منفذ العرض: cqw هي 1% من عرض الحاوية، وcqi 1% من حجمها الداخلي. تسمح لمكوّن بالتحجيم إلى الصندوق الذي يعيش فيه، بغض النظر عن حجم الشاشة.

نعم. جميع الوحدات الـ45 موثّقة مجاناً في صفحة تعمل بالكامل داخل متصفحك - دون تسجيل ودون طلبات إلى الخادم.

شارك هذا
هل تحتاج إلى مساعدة؟
هل واجهت مشكلة في هذه الأداة؟ أخبر فريقنا.
الإبلاغ عن مشكلة

أضف هذه الأداة المجانية إلى موقعك الخاص — انسخ والصق الكود أدناه.