Có hệ thống lưới CSS hỗ trợ chiều rộng đầy đủ không?

Question

Có hệ thống lưới CSS nào hỗ trợ chiều rộng khung nhìn đầy đủ không? Hầu hết các hệ thống lưới dường như chỉ có ý định chiều rộng 960px lên đến 1140px. Đây là chiều rộng được triển khai nhiều nhất cho Người dùng thông thường (vì hầu hết mọi người đang sử dụng 1280px × 1024px).

Mục đích của tôi là có bố cục đáp ứng cho Người dùng sử dụng ngay cả Độ phân giải HD đầy đủ (1920px × 1080px).

Nếu có một/cách tốt hơn đơn giản hơn để làm cho nó, xin cho tôi biết

Answer 1

Twitter bootstrap hệ thống lưới chất lỏng làm việc với tỷ lệ phần trăm: http://twitter.github.com/bootstrap/scaffolding.html#fluidGridSystem

Ngoài ra còn có rất nhiều css tinh khiết hệ thống lưới điện đáp ứng, cho dụ: Skeleton

bài viết này đề cập đến rất nhiều trong số họ: http://speckyboy.com/2011/11/17/15-responsive-css-frameworks-worth-considering/

có thể để làm điều đó cho mình, sử dụng phần trăm cho chiều rộng css , media queries và js fallbacks (vì các truy vấn phương tiện truyền thông không được hỗ trợ đầy đủ).

Nhưng những hệ thống lưới điện đó sẽ giúp bạn tiết kiệm thời gian và đau đầu vì chúng được kiểm tra tốt nhất.

Để giúp quyết định của bạn, bạn nên xem xét:

• Sự hỗ trợ trình duyệt bạn cần và những cung cấp bởi hệ thống lưới điện.
• Kích thước (chúng nhẹ đối với hầu hết, nhưng một số không chỉ là lưới hệ thống, tức là máy khởi động Twitter).
• Quy ước đặt tên, bạn sẽ sử dụng sử dụng lớp css lạ (ví dụ: span4), chọn tùy chọn bạn thích, một số ngữ nghĩa hơn ngữ nghĩa khác.
• Và tại nhất, các nguồn tin công khai yếu tố: cộng đồng, hỗ trợ, cập nhật tần số ...

Ngoài ra, trang web này là một nguồn cảm hứng nhất cho đáp ứng: http://mediaqueri.es/

Answer 2

Tôi đã làm việc trên một hệ thống lưới chất lỏng được gọi là Fluidable. Bạn có thể đặt độ rộng tối đa cho bất kỳ thứ gì bạn muốn. Trong trường hợp của bạn, bạn chỉ có thể đặt nó thành 100% và lưới sẽ sử dụng hết tất cả không gian. Bạn cũng có thể định cấu hình bất kỳ số lượng cột nào bạn muốn sử dụng.

https://github.com/andri/Fluidable

Answer 3

Đối với dự án nhỏ, tôi muốn giới thiệu Amazium. Nó cung cấp 12 cột, làm tổ, bù đắp và truy vấn phương tiện cơ bản. Để có được một toàn màn hình lưới, đánh dấu của bạn sẽ giống như thế:

<div class="row-max"> 
    <div class="grid_12"> 
     ... 
     <div class="row-max"> 
      <div class="grid_6">...</div> 
      <div class="grid_6">...</div> 
     </div> 
    </div> 
</div>