CSS - Đơn vị đo lường

Trước khi bắt đầu bài thực hành, chúng tôi muốn đưa ra một ý tưởng ngắn gọn về các Đơn vị đo lường CSS. 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 phép đo tương đối như phần trăm và đơn vị em. Bạn cần các 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, ví dụ:border = "1px solid red".

Chúng tôi đã liệt kê tất cả các Đơn vị đo lường CSS cùng với các ví dụ thích hợp -

Đơn vị	Sự miêu tả	Thí dụ
%	Xác định phép đo dưới dạng phần trăm liên quan đến 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 không gian 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, mỗi đơn vị "em" sẽ là 12pt; do đó, 2em sẽ là 24pt.	p {letter-spacing: 7em;}
Ví dụ	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;}
trong	Xác định một phép đo bằng inch.	p {khoảng cách từ: .15in;}
mm	Xác định một phép đo bằng milimét.	p {khoảng cách giữa các từ: 15mm;}
máy tính	Xác định một phép đo trong 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.	nội dung {font-size: 18pt;}
px	Xác định phép đo bằng pixel màn hình.	p {padding: 25px;}