مرجع وحدات CSS
مرجع مجاني عبر الإنترنت لوحدات CSS مثل px وem وrem و% وvw وvh وvmin وvmax وch حسب الفئة، مع شرح واضح لمتى وكيفية استخدام كل وحدة مطلقة ونسبية في تصميمك.
| الوحدة | الاسم | النوع | الوصف | مثال |
|---|---|---|---|---|
| px | Pixels | absolute | بكسل واحد على الشاشة. الوحدة الأساسية. | font-size: 16px; |
| em | Em | relative | مضاعف حجم خط العنصر الأب. | padding: 1.5em; |
| rem | Root Em | relative | مضاعف حجم خط العنصر الجذر (html). | margin: 2rem; |
| % | Percent | relative | نسبة مئوية من خاصية الأب المقابلة. | width: 50%; |
| vw | Viewport Width | viewport | 1% من عرض منفذ العرض. | width: 100vw; |
| vh | Viewport Height | viewport | 1% من ارتفاع منفذ العرض. | height: 100vh; |
| vmin | Viewport Min | viewport | 1% من الأصغر بين vw و vh. | font-size: 5vmin; |
| vmax | Viewport Max | viewport | 1% من الأكبر بين vw و vh. | width: 50vmax; |
| dvh | Dynamic VH | viewport | ارتفاع منفذ العرض الديناميكي (يراعي شريط عنوان الجوال). | height: 100dvh; |
| svh | Small VH | viewport | أصغر ارتفاع لمنفذ العرض. | min-height: 100svh; |
| lvh | Large VH | viewport | أكبر ارتفاع لمنفذ العرض. | max-height: 100lvh; |
| ch | Character | relative | بناءً على عرض الحرف "0". | max-width: 60ch; |
| ex | X-Height | relative | بناءً على ارتفاع الحرف "x". | line-height: 2ex; |
| cm | Centimeters | absolute | سنتيمترات. للطباعة. | width: 10cm; |
| mm | Millimeters | absolute | مليمترات. للطباعة. | margin: 5mm; |
| in | Inches | absolute | بوصة (1in = 96px). | width: 2in; |
| pt | Points | absolute | نقاط (1pt = 1/72in). | font-size: 12pt; |
| cqi | Container Inline | container | 1% من الحجم السطري للحاوية. | font-size: 5cqi; |
| cqb | Container Block | container | 1% من حجم كتلة الحاوية. | padding: 2cqb; |
19개 표시 중
تضمين
آخر تحديث: 2026 · أداة مجانية عبر الإنترنت
ما هو مرجع وحدات CSS؟
مرجع مجاني عبر الإنترنت لوحدات CSS مثل px وem وrem و% وvw وvh وvmin وvmax وch حسب الفئة، مع شرح واضح لمتى وكيفية استخدام كل وحدة مطلقة ونسبية في تصميمك.
كيفية الاستخدام
- 1الإدخال— أدخل البيانات المطلوبة.
- 2النتائج— راجع النتائج المعالجة.
- 3النسخ— انسخ النتائج لاستخدامها.
أدوات ذات صلة
محوّل PX-REMمحول PX إلى REM يحسب وحدات البكسل وrem في الاتجاهين وفق حجم خط جذري قابل للتخصيص، مع دعم الكسور العشرية. يتضمن جدول مرجعي ومقتطف CSS قابلين للنسخ، مجانًا.
فحص توافق المتصفحاتأداة مجانية عبر الإنترنت تعرض إصدارات Chrome وFirefox وSafari وEdge التي تدعم ميزة CSS أو JavaScript أو HTML أو Web API محددة.
مولد تدرج CSSمولد تدرجات CSS مرئي ومجاني عبر الإنترنت: صمم تدرجات خطية وشعاعية ومخروطية، وأضف نقاط ألوان متعددة، واضبط الزاوية، ثم انسخ كود CSS الجاهز لخلفيات موقعك.
مولد ظل CSS box-shadowمولّد box-shadow في CSS بضوابط للإزاحة والتمويه والانتشار واللون وinset مع معاينة حية للظل. انسخ شيفرة CSS الجاهزة لأي عنصر، مجانًا داخل المتصفح.
الأسئلة الشائعة
مرجع مجاني لوحدات CSS يشمل الطول والزاوية والوقت.
لا. تتم جميع المعالجة في متصفحك.
نعم، التصميم المتجاوب يعمل على الأجهزة المحمولة.