Dev Patrache

مرجع وحدات CSS

UnitNameTypeDescriptionExample
pxPixelsabsoluteOne pixel on screen. The most basic unit.font-size: 16px;
emEmrelativeMultiple of the parent element font-size.padding: 1.5em;
remRoot EmrelativeMultiple of the root (html) element font-size.margin: 2rem;
%PercentrelativePercentage relative to the corresponding parent property.width: 50%;
vwViewport Widthviewport1% of the viewport width.width: 100vw;
vhViewport Heightviewport1% of the viewport height.height: 100vh;
vminViewport Minviewport1% of the smaller of vw and vh.font-size: 5vmin;
vmaxViewport Maxviewport1% of the larger of vw and vh.width: 50vmax;
dvhDynamic VHviewportDynamic viewport height (accounts for mobile address bar).height: 100dvh;
svhSmall VHviewportSmallest viewport height.min-height: 100svh;
lvhLarge VHviewportLargest viewport height.max-height: 100lvh;
chCharacterrelativeBased on the width of the "0" character.max-width: 60ch;
exX-HeightrelativeBased on the height of the "x" character.line-height: 2ex;
cmCentimetersabsoluteCentimeters. For print.width: 10cm;
mmMillimetersabsoluteMillimeters. For print.margin: 5mm;
inInchesabsoluteInches (1in = 96px).width: 2in;
ptPointsabsolutePoints (1pt = 1/72in).font-size: 12pt;
cqiContainer Inlinecontainer1% of the container inline size.font-size: 5cqi;
cqbContainer Blockcontainer1% of the container block size.padding: 2cqb;
19개 표시 중
آخر تحديث: 2026 · أداة مجانية عبر الإنترنت

ما هو مرجع وحدات CSS؟

مرجع مجاني عبر الإنترنت لوحدات CSS مثل px وem وrem و% وvw وvh وvmin وvmax وch حسب الفئة، مع شرح واضح لمتى وكيفية استخدام كل وحدة مطلقة ونسبية في تصميمك.

كيفية الاستخدام

  1. 1
    الإدخال— أدخل البيانات المطلوبة.
  2. 2
    النتائج— راجع النتائج المعالجة.
  3. 3
    النسخ— انسخ النتائج لاستخدامها.

أدوات ذات صلة

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

مرجع مجاني لوحدات CSS يشمل الطول والزاوية والوقت.

لا. تتم جميع المعالجة في متصفحك.

نعم، التصميم المتجاوب يعمل على الأجهزة المحمولة.

يستخدم هذا الموقع ملفات تعريف الارتباط لتحسين التجربة والإعلانات. معرفة المزيد