Bu soru gerçek CSS direktifleri kendi içlerinde bir düzenleme .css dosyası. Sayfa yeni sayfa veya bir dizi geliştirirken, ben genellikle sadece elle direktifleri ekleyin .dosya, zaman bulunca yeniden oluşturulması için çalışıyor css. Bir süre sonra, yüzlerce (ya da binlerce) hatları var ve bu düzen verdiği zaman ihtiyacım olanı bulmak zor olabilir.

Herkes yönergeleri düzenlemek için nasıl bir tavsiye var mı?

• Yukarıdan aşağıya, DOM taklit organize etmeye çalışayım mı?
• İşlevsel olarak organize edeyim, UI aynı parçaları destek elemanları için direktifler koyarak?
• Sadece alfabetik olarak seçici ile her şeyi düşünmek gerekir?
• Bu yaklaşımların bir bileşimi mi?

Ayrıca, ne kadar tek bir dosya içine ayrı dosyalar koparmak için iyi bir fikir olabilir önce tutulması gereken bir sınırlama var mı? , 1000 hat demek? Ya da her zaman iyi bir fikir tek bir yerde her şeyi tutmak için mi?

İlgili Soru: What's the best way to organize CSS rules?

Başlangıç için bu üç slideshare sunumlar bakabilirsiniz:

• Beautiful Maintainable CSS
• Maintainable CSS
• Efficient, maintainable, modular CSS

Birincisi ve en önemlisi, CSS belge. CSS düzenlemek için kullanmak ne olursa olsun, tutarlı olmak ve bunu belgelemek. Bu dosya belki bir içindekiler tablosu sağladığı şeyler ise, her dosyanın başında tarif, belki Düzenleyicisi bu bölümlere kolayca atlamak çok benzersiz etiketleri aramak için kolay referans.

Eğer birden fazla dosya içine CSS ayırmak istiyorsanız, elbette öyle. Oli zaten fazladan HTTP istekleri pahalı olabileceğini dile getirdi, ama her iki dünyanın en iyi olabilir. Bir çeşit inşa komut dosyası sıkıştırılmış, tek bir CSS dosyası için iyi belgelenmiş, modüler CSS yayımlamak için kullanın. YUI Compressor sıkıştırma yardımcı olabilir.

Başkalarının söylediklerini aksine şimdiye kadar, ayrı bir hat üzerinde her özelliği yazma ve grup ile ilgili kurallar için girinti kullanmak tercih ederim. E. g. Oli aşağıdaki örnek:

#content {
    /* css */
}
    #content div {
        /* css */
    }
    #content span {
        /* css */
    }
    #content etc {
        /* css */
    }

#header {
    /* css */
}
    #header etc {
        /* css */
    }

Bu kolaylaştırır takip dosya yapısı, özellikle de yeterince boşluk ve açıkça işaretlenmiş yorumların arasında gruplar (ama kadar kolay yağsız aracılığıyla hızlı ve kolay düzenleme (beri gerek yok wade tek uzun çizgiler CSS için her kuralı).

Anlamak ve cascade specificity (seçiciler alfabetik sıralama çok doğru çıktı) kullanın.

Olsun ben bu site büyüklüğü ve karmaşıklığı ve CSS bağlıdır, birden fazla dosya içine ve benim CSS ayrıldım. Ben her zaman en az reset.css. Bu eğilimi olmak, beraberinde layout.css için genel sayfa düzeni, nav.css site navigasyon menüleri biraz karışık ve forms.css eğer var olan CSS stil benim formları. Ben de hala anlamaya çalışıyorum onun dışında çok. colors.css type.css/fonts.css/grafik ve tipografi, base.css (renklerim kapalı tüm HTML etiketleri için tam bir temel stil sağlamak için bölmek zorunda kalabilirim...