Trong CSS có khá nhiều đơn vị dùng cho kích thước. Một số có lịch sử từ ngành công nghiệp in ấn như point (pt) hay pica (pc), một số lại rất quen thuộc trong đời sống hàng ngày như cm, mm, in, hoặc là px, em, %,… Vậy điểm khác biệt giữa chúng là gì? Sử dụng chúng trong những trường hợp nào? Bài viết này sẽ làm sáng tỏ phần nào những điều trên. Show Hiểu về các đơn vị
Sử dụng khi nào? px là chuẩn nhất cho việc hiển thị trên web nhưng trong một số trường hợp bạn cần tới các đơn vị khác: Thiết kế layout “responsive”: sử dụng CSS để tạo ra giao diện hiển thị phù hợp với tất cả các thiết bị và độ phân giải màn hình.  Giả sử bạn thiết kế một trang web với phần nội dung chính có độ rộng là 1000px và căn giữa. Bạn dùng laptop ở độ phân giải là 1366×768, và thấy nó rất hợp lý. Tuy nhiên khi thử chuyển sang màn hình destop 1920×1080, bạn lại thấy nó quá nhỏ. Lúc này, bạn nên nghĩ đến việc dùng %: main { margin: 0 auto; // Căn giữa width: 73.20644%; // 73.20644% = 1000/1366, là tỷ lệ bạn thấy hợp lý }Thay đổi kích thước font chữ toàn trang: giả sử bạn muốn trên desktop độ phân giải cao, kích thước chữ lớn còn trên smartphone độ phân giải thấp, kích thước chữ nhỏ đi nhưng bạn lại đặt kích thước chữ khác nhau tại rất nhiều chỗ khác nhau, do đó bạn phải thay đổi toàn bộ những chỗ này. Oài, nếu có 100 chỗ như thế thì thật là…. Giải pháp ở đây là thiết lập font-size cố định cho toàn trang và thiết lập các thành phần khác tỷ lệ theo nó: body { font-size: 62.5%; } // 62.5% = 10px h1 { font-size: 1.6em; } // 1.6em = 16px h2 { font-size: 1.4em; } // 1.4em = 14px h3 { font-size: 1.2em; } // 1.2em = 12px ... Thiết kế CSS cho việc in ấn: bạn nên sử dụng pt cho mục đích này Kết luận Trong thực tế còn rất nhiều các trường hợp khác mà ta nên sử dụng đơn vị này hay không nên sử dụng đơn vị kia. Hiểu rõ về các đơn vị và cách sử dụng chúng là điều cần thiết nếu bạn muốn thành thạo lập trình web Bạn thường hay nghe đến tỉ lệ khung hình 18:9, 16:9 trên điện thoại hay tỉ lệ 4:3, 16:10 nhưng không biết những thông số về tỉ lệ khung hình nay nói lên điều gì? Trong bài viết này, Điện Máy Chợ Lớn sẽ phân tích đến cho các bạn rõ hơn về khái niệm nà nhé! Tỉ lệ khung hình là gì?Tỉ lệ khung hình Tỉ lệ khung hình được hiểu là sự kết hợp giữa chiều rộng và chiều cao của kích thước màn hình. Để hiển thị thông số tỉ lệ khung hình, người ta thường dùng hai số dương viết liền với nhau với hai dấu chấm ở giữa. Ví dụ như: 16:9, thì 16 là x, còn 9 là y, từ đó suy ra: X là chiều rộng, Y là chiều ao và hai thông số này quan hệ tỉ lệ với nhau. Các loại tỉ lệ khung hình phổ biếnTỉ lệ màn hình 4:3Tỉ lệ màn hình 4:3 Tỉ lệ màn hình 4:3 được dùng nhiều cho các loại màn hình máy tính hiện nay thích hợp cho những người dùng văn phòng làm việc. Mỗi khung hình trên phim đều có chiều rộng 35mm và 4 lỗ kéo phim dọc theo chiều cao. Kích thước và khoảng cách từ các lỗ tạo nên hình ảnh có tỉ lệ 4:3. Tỉ lệ màn hình 16:9Tỉ lệ màn hình 16:9 Phần lớn các mẫu điện thoại iPhone có mặt trên thị trường đều có tỉ lệ màn hình 16:9. Ngoại trừ các thế hệ iPhone cũ (từ 4s trở xuống) và một số sản phẩm smartphone kì cục như Optimus Vu của LG, các model smartphone ra mắt trong những năm gần đây luôn có tỉ lệ màn hình 16:9. Tỉ lệ màn hình 16:10Tỉ lệ màn hình 16:10 Tỉ lệ màn hình 16:10 hiện nay đa số được áp dụng trên các dòng tivi LCD, Plasma cỡ lớn và các màn hình laptop chơi game. Ưu điểm của tỉ lệ màn hình này là có thể xem phim màn ảnh rộng tuyệt vời, gần như Full Screen và không thấy các viền đen trên và dưới màn hình. Tỉ lệ màn hình 18:9Tỉ lệ màn hình 18:9 Tỉ lệ màn hình 18:9 hay 19:9 được áp dụng hầu hết vào các dòng smartphone cao cấp hiện nay như iPhone 14 Pro Max 512GB nhằm làm tăng kích thước màn hình nhưng vẫn giữ được kết cấu tổng thể máy gọn gàng hơn, dễ cầm nắm hơn và làm cho tính thẩm mỹ của điện thoại được đẹp hơn rất nhiều lần. 1920x1080 là tỉ lệ bao nhiêu?Full HD là gì 1080x1920 là gì? Độ phân giải 1080x1920 hay còn được gọi là độ phân giải Full HD bao gồm 1920 hàng ngang chứa điểm ảnh (hay còn gọi là pixels) và 1080 hàng dọc chứa điểm ảnh theo tỷ lệ 16:9. 1920x1080 là bao nhiêu inch laptop Dell?1920x1080 là bao nhiêu cm Màn hình 61 cm (tương ứng 24 inch) Màn hình 68,6 cm (tương ứng 27 inch) Kích thước màn hình iPhone 11 bao nhiêu pixel?Chi tiết thông số màn hình iPhone 11 như sau: 150,9×75,7×8,3mm, kích thước 6.1 inch. Kết cấu màn hình iPhone 11 sử dụng tấm trang bị tấm nền IPS LCD công nghệ màn hình Retina cao cấp với khả năng hiển thị đạt chất lượng điểm ảnh 326 ppi – 1792×828 pixels và độ tương phản 1400:1. iPad Pro 11 inch là bao nhiêu cm?Kích thước của iPad Pro 11 inch (2020) như sau: Chiều dài: 247.6 mm (9.74 inch) Chiều rộng: 178.5 mm (7.02 inch) Độ dày: 5.9 mm (0.23 inch) |
