หน่วยที่ใช้วัดค่าต่างๆ ใน Style Sheet

จาก syntax ของคำสั่ง CSS ค่า value ของ property บางค่าจะต้องมีการระบุหน่วยด้วย   หน่วยที่ใช้งานใน CSS มีอะไรบ้าง มาดูกันเลยครับ

หน่วยแบบ Relative Length (กำหนดแบบอัตราส่วน)

• px (pixels, สัมพันธ์กับค่าความละเอียดของหน้าจอ) 
• em (emphasize, ความสูงของตัวอักษร) เป็นขนาดจำนวนเท่าของขนาด font ที่กำหนดให้ body 
  ถ้า font ที่ body กำหนดเป็น 10px 
  h1{fon-size:1.5em} h1 จะมีขนาดเป็น 1.5 เท่า ของ 10px = 15px
  h2{fon-size:1.4em} h2 จะมีขนาดเป็น 1.4 เท่า ของ 10px = 14px 
  และถ้าเรากำหนดเป็น 1em ก็จะมีขนาด้เท่ากับ 10px เหมือนเดิม
• ex (x-height, ความสูงของตัวอักษร "x") เช่น 1.5ex, 2ex
• % (percent, สัมพันธ์กับขนาดหน้าจอ หรือ container ที่บรรจุวัตถุนั้นๆ อยู่) เช่น 50%, 130%

หน่วยแบบ Absolute Length (กำหนดตายตัว)

• in (inches; 1in=2.54cm =72pt =6pc) เช่น 2in, 1.5in
• cm (centimeters; 1cm=10mm) เช่น 2cm, 1.11cm
• mm (millimeters) เช่น 50mm, 0.8mm
• pt (points; 1pt=1/72in, 10pt มีขนาดพอๆกับ 12px) เป็นหน่วยที่ใช้ในงานสิ่งพิมพเช่น 12pt, 20pt
• pc (picas; 1pc=12pt) เช่น 1pc, 2pc