Điểm máng xối trong khung lưới CSS là gì?

Question

Tôi đang đi sâu vào phát triển web và tôi đang chơi với khung công tác CSS Blueprint, bao gồm hệ thống lưới và tôi có một vài câu hỏi.

1. Điểm máng xối là gì? Chắc chắn chúng không được sử dụng để bao gồm khoảng cách giữa các cột vì bạn chỉ có thể sử dụng thuộc tính CSS lề cho điều đó, đúng không? Hoặc là máng xối chỉ là một cách thanh lịch để quản lý lợi nhuận?
2. Tôi không muốn có bất kỳ khoảng cách nào giữa các cột và muốn tạo bố cục lưới không bao gồm máng xối, nhưng tất cả các công cụ máy phát đều ngăn không cho tôi có máng có chiều rộng bằng 0. Tại sao vậy?
3. Nó xuất hiện the suggested Blueprint CSS generator không còn được hỗ trợ. Bất cứ ai có thể đề nghị một máy phát điện CSS Blueprint để sửa đổi lưới điện để bao gồm máng xối zero-width?

Cảm ơn bạn rất nhiều vì đã khôn ngoan!

Answer 1

Động lực đằng sau hệ thống lưới CSS là tự động hoàn toàn bố cục. Máng xối thường được mong muốn bởi vì khoảng trắng giữa các cột làm cho độ rõ ràng tốt hơn nên việc đưa chúng vào như là một phần của tự động hóa có ý nghĩa.

Raison d'être của máy phát điện là để giúp bạn giảm bớt các tính toán hơi tẻ nhạt cần thiết để thực hiện chúng nhưng không có máng xối cả toán và css không hề phức tạp.

Nó sẽ rất thẳng về phía trước để làm lưới không có máng xối mà không có máy phát điện. ví dụ.

(column width X nº of columns) + left margin + right margin = content width 

.span-1 {width:100px} 
.span-2 {width:200px} 
.span-3 {width:300px} 
.span-4 {width:400px} 

etc... 

Answer 2

Máy cắt hoàn toàn không liên quan gì đến CSS mỗi lần. Chúng là một khái niệm thiết kế từ xuất bản in - chúng có nghĩa là cung cấp khoảng trắng giữa các cột, giúp nội dung dễ đọc hơn.

Cột không có máng xối rất dễ tính. Chỉ cần đặt cùng chiều rộng bằng pixel cho mỗi cột.