kiểm tra Responsive trong xây dựng trang web design

Khi thực hiện việc, bạn thường kiểm sát Responsive bằng cách co giãn kích thước trình thông qua bằng tay nhưng nó không được “logic” cho lắm. Mà mình sẽ khuyến khích quý khách tiêu dùng các dụng cụ hỗ trợ để kiểm sát, một trong những dụng cụ khảo sát Responsive mà mình thích nhất đó là Resizer, siêu dễ dàng 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ư ý và đảm bảo nó vận hành chất lượng trên đa dạng thiết bị, nhất là các trang bị thông dụng. Bạn khả năng cao tham khảo các size chiều rộng của các thiết bị tại đây, nhưng đa phần một dự án bạn chỉ tốt nhất nên tạo các breakpoint CSS như là 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 tặng 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 (sieutocviet.page)

Có hơn 5 năm thực chiến Wordpress, asp.net 6 năm kinh nghiệm trong quản trị website tư vấn giải pháp Seo google, Kinh doanh online tối ưu nhất cho công ty.
Hiện đang là leader kinh doanh tại Siêu Tốc Việt. ping post