CSS hỗ trợ một số phép đo bao gồm các đơn vị tuyệt đối như inch, cm, điểm, v.v., cũng như các số đo tương đối như tỷ lệ phần trăm và đơn vị em. Bạn cần những giá trị này trong khi chỉ định các phép đo khác nhau trong quy tắc Kiểu của mình.
Sau đây là các Đơn vị đo lường CSS cùng với:
| Đơn vị | Mô tả | Ví dụ |
|---|---|---|
| % | xác định phép đo dưới dạng phần trăm so với giá trị khác, thường là một phần tử bao quanh. | p {font-size:16pt; chiều cao dòng:125%;} |
| cm | xác định một phép đo bằng cm. | div {margin-bottom:2cm;} |
| em | Một phép đo tương đối cho chiều cao của phông chữ trong khoảng cách em. Bởi vì một đơn vị em tương đương với kích thước của một phông chữ nhất định, nếu bạn gán một phông chữ cho 12pt, thì mỗi đơn vị "em" sẽ là 12pt; do đó, 2em sẽ là 24pt. | p {letter-spacing:7em;} |
| ex | Giá trị này xác định phép đo liên quan đến chiều cao x của phông chữ. Chiều cao x được xác định bằng chiều cao của chữ x viết thường của phông chữ. | p {font-size:24pt; line-height:3ex;} |
| in | xác định phép đo bằng inch. | p {word-spacing:.15in;} |
| mm | xác định một phép đo bằng milimét. | p {word-spacing:15mm;} |
| pc | xác định phép đo bằng picas. Một pica tương đương với 12 điểm; do đó, có 6 picas mỗi inch. | p {font-size:20pc;} |
| pt | xác định một phép đo bằng điểm. Một điểm được định nghĩa là 1/72 inch. | body {font-size:18pt;} |
| px | xác định phép đo bằng pixel màn hình. | p {padding:25px;} |
| vh | 1% chiều cao khung nhìn. | h2 {font-size:3.0vh; } |
| vw | 1% chiều rộng khung nhìn | h1 {font-size:5.9vw; } |
| vmin | 1vw hoặc 1vh, tùy theo giá trị nào nhỏ hơn | p {font-size:2vmin;} |