đánh giá Responsive trong gây dựng trang web design

Khi làm việc, bạn thường khảo sát Responsive bằng cách co giãn kích thước trình duyệt y bằng tay nhưng nó không được “logic” tặng lắm. Mà mình sẽ khuyến khích người mua tiêu dùng các công cụ giúp để khảo sát, một trong những công cụ đánh giá Responsive mà mình thích nhất đó là Resizer, siêu dễ tiêu dùng và gọn nhẹ. Hãy xem cách tiêu dùng bằng ảnh dưới:

Danh sách các kích thước màn hình trang bị

Khi viết CSS đưa cho giao diện Responsive, việc trọng yếu nhất là bạn phải nắm được kích thước màn hình của các loại điện thoại thông dụng để khả năng cao viết CSS được như mong muốn và chắc chắn nó hoạt động hiệu quả trên phổ biến đồ vật, nhất là các thiết bị thông dụng. Bạn thường tham khảo các size chiều rộng của các trang bị tại đây, nhưng đa phần một dự án bạn chỉ nên tạo các breakpoint CSS giống như sau:

  • max-width: 320px (điện thoại di động, hiển thị chiều dọc)
  • max-width: 480px (điện thoại di động, hiển thị chiều ngang)
  • max-width: 600px (máy tính bảng, hiển thị chiều dọc)
  • max-width: 800px (máy tính bảng, hiển thị chiều ngang)
  • max-width: 768px (máy tính bảng loại to, hiển thị chiều dọc)
  • max-width: 1024px (máy tính bảng loại to, hiển thị chiều ngang)
  • min-width: 1025px (từ size này trở lên là danh đưa cho desktop thông thường).

 

5/5 - (1 bình chọn)

Responsive Web Design Cẩm Nang Thiết kế Web

Lê Trương Tấn Lộc (webseowp.vn)

Trải qua 4 năm thực chiến Python, PHP 7 năm thực chiến trong quản lý website tư vấn giải pháp Seo top, Digital marketing tối ưu nhất cho công ty.
Hiện là leader kinh doanh tại Siêu Tốc Việt.