CSS @import Thực tiễn tốt nhất

Question

Tôi đang lấy ý kiến ​​về cách tốt nhất để xử lý @ import hoặc để tránh tất cả chúng cùng nhau.

Làm việc với DNN Tôi thấy rằng, trong khi skinning, CSS cho tất cả các phần tử ghi đè khác nhau cho các mô-đun và điều đó có thể rất lộn xộn. Dumping tất cả các CSS vào một tập tin duy nhất có thể được khó khăn để làm việc với và tôi tự hỏi nếu nó là tốt hơn để tách chúng và nhập chúng ở đầu của skin.css. Có câu hỏi về hiệu quả là tốt và nếu điều này là hoặc không phải là một thương mại tốt.

Tôi không phải là chuyên gia CSS nhưng tôi nghĩ rằng tôi có thể biết câu trả lời cho vấn đề này nhưng sẽ hỏi. Có anyway để tham khảo các tập tin CSS khác nhau theo cùng một cách như, nói, .cs tập tin? skin.Events.someElement? Sẽ không được tốt đẹp? ;-)

Cảm ơn.

Answer 1

Từ kinh nghiệm tinh khiết:

Trong khi làm việc, bạn có thể giữ mọi thứ ngăn cách (reset.css, forms.css, main.css, vv) nếu bạn thấy khó để làm việc với một file duy nhất - I don' t thậm chí làm điều đó ..

Khi đưa vào sản xuất - giữ mọi thứ trong một tập tin - không nhập - yêu cầu 1 máy chủ - giảm thiểu css của bạn.

Ngoại lệ là một tệp bổ sung.css nếu bạn muốn duy trì tính năng xác thực miễn phí/vượt qua main.css của mình (tôi cũng không làm điều này vì không một khách hàng nào của tôi quan tâm đến xác thực - mọi người muốn nó hoạt động, phù hiệu không phải là một xu hướng :) - vì vậy tôi chỉ sử dụng hacks máng main.css của tôi (#, _, vv))

Answer 2

Tốt nhất là tránh @import.

Theo Steve Souders, kết hợp, @import và link hoặc nhúng @import vào bảng định kiểu khác sẽ gây ra tuần tự hơn là tải xuống song song.

Có những vấn đề khác nữa.

http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

Yahoo cũng khuyến cáo chống lại @import, lưu ý rằng

Trong IE @import cư xử giống như sử dụng ở dưới cùng của trang , vì vậy tốt nhất không sử dụng nó.

http://developer.yahoo.com/performance/rules.html#csslink

Tôi thường sử dụng một stylesheet và sử dụng link để lấy nó.

Đối với các trang web đặc biệt lớn, tôi sử dụng một biểu định kiểu chính và sau đó trang tính nhỏ hơn cho các phần cần thêm phong cách, thêm các biểu định kiểu đó vào các trang khác nhau nếu cần.