مرجع وحدات CSS
| 단위 | 이름 | 유형 | 설명 | 예시 |
|---|---|---|---|---|
| px | Pixels | absolute | 화면의 1픽셀. 가장 기본적인 단위. | font-size: 16px; |
| em | Em | relative | 부모 요소의 font-size 기준 배수. | padding: 1.5em; |
| rem | Root Em | relative | 루트(html) 요소의 font-size 기준 배수. | margin: 2rem; |
| % | Percent | relative | 부모 요소의 해당 속성 기준 백분율. | width: 50%; |
| vw | Viewport Width | viewport | 뷰포트 너비의 1%. | width: 100vw; |
| vh | Viewport Height | viewport | 뷰포트 높이의 1%. | height: 100vh; |
| vmin | Viewport Min | viewport | vw와 vh 중 작은 값의 1%. | font-size: 5vmin; |
| vmax | Viewport Max | viewport | vw와 vh 중 큰 값의 1%. | 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 النسخ — انسخ النتائج لاستخدامها.
أدوات ذات صلة
ورقة مرجعية للتعبيرات المنتظمة ورقة مرجعية مجانية وقابلة للبحث للتعبيرات النمطية تنظّم بناء جملة regex حسب فئات مثل الأحرف الوصفية والمكميات والمرابط والمجموعات، مع نسخ الأنماط بنقرة واحدة وتوافق regex مع JavaScript.
مرجع Git السريع ورقة مرجعية مجانية لأوامر Git قابلة للبحث حسب الفئة، من الفروع والدمج إلى rebase وstash وreset، يعرض كل أمر طريقة الاستخدام ومستوى الخطورة لتجنب الأخطاء.
الأسئلة الشائعة
مرجع مجاني لوحدات CSS يشمل الطول والزاوية والوقت.
لا. تتم جميع المعالجة في متصفحك.
نعم، التصميم المتجاوب يعمل على الأجهزة المحمولة.