Viewport là gì?
Còn gọi: vùng hiển thị của trình duyệt, meta viewport, khung nhìn, vùng hiển thị, viewport là gì
Viewport là vùng hiển thị nội dung trang web bên trong cửa sổ trình duyệt hoặc màn hình điện thoại; kích thước viewport quyết định bố cục responsive sẽ hiển thị theo breakpoint nào.
Hiểu kỹ hơn
Trên máy tính, viewport thay đổi khi người dùng kéo co cửa sổ. Trên điện thoại, trang web cần thẻ meta viewport trong phần head của HTML, phổ biến nhất là name=viewport với content width=device-width, initial-scale=1. Thiếu thẻ này, trình duyệt di động sẽ giả lập một màn hình rộng khoảng 980 px rồi thu nhỏ cả trang, khiến chữ li ti và phải phóng to mới đọc được. Kích thước viewport tính bằng pixel CSS, không phải pixel vật lý: một iPhone có màn hình hàng nghìn điểm ảnh nhưng viewport chỉ khoảng 390 đến 430 px chiều ngang. Vì vậy, khi thiết kế mobile trong Figma, frame thường đặt rộng 360 đến 430 px. Không nên chặn người dùng phóng to bằng user-scalable=no, vì ảnh hưởng người nhìn kém.
