CSS มีหน่วยหลายอย่างสำหรับคุณสมบัติต่างๆ เช่น width, margin, padding, font-size, border-width เป็นต้น ความยาวจะระบุด้วยค่าตัวเลขตามด้วยหน่วยความยาว เช่น px, dp, em ไม่อนุญาตให้มีช่องว่างระหว่างค่าตัวเลขและหน่วย
หน่วยความยาวแบ่งออกเป็น 2 ประเภท:
- Relative units (หน่วยแบบสัมพัทธ์)
- Absolute units (หน่วยแบบคงที่)
Absolute Units (หน่วยแบบคงที่)
| หน่วย | ตัวย่อ |
|---|---|
| Pixels | px |
| Points | pt |
| Inches | in |
| Centimeters | cm |
| Picas | pc |
Relative Units (หน่วยแบบสัมพัทธ์)
ในหน่วยแบบสัมพัทธ์ ค่าความยาวจะคงที่และแสดงขนาดที่แท้จริงขององค์ประกอบ
| หน่วย | ตัวย่อ |
|---|---|
| Percent | % |
| Em | em |
| Ex | ex |
| Root em | rem |
| Viewport width | vw |
| Viewport height | vh |
| Viewport min | vmin |
| Character | ch |
| Grid | gd |