拥有一个包含几乎每个页面都要使用的样式元素的怪物.css文件有什么好处吗?

我在想,为了便于管理,我想把不同类型的CSS拉出到几个文件中,并包括我的主<link />是坏的吗?

我觉得这样更好

positions.css buttons.css tables.css copy.css

vs.

site.css

你见过用一种方法做和用另一种方法做有什么问题吗?


当前回答

存在一个临界点,在这个临界点上使用多个css文件是有益的。

一个拥有100万以上页面的网站,平均用户可能只看到其中的5个,可能有一个巨大的样式表,所以试图通过大量的初始下载来节省每次页面加载的单个额外请求的开销是虚假的经济。

把这个论点延伸到极致——这就像是建议整个网络应该维护一个大的样式表。显然是荒谬的。

每个网站的临界点都不一样,所以没有硬性规定。这将取决于每个页面的唯一css数量、页面数量以及普通用户在使用网站时可能经常遇到的页面数量。

其他回答

I've created a systematic approach to CSS development. This way I can utilize a standard that never changes. First I started with the 960 grid system. Then I created single lines of css for basic layouts, margins, padding, fonts and sizes. I then string them together as needed. This allows me to keep a consistent layout across all of my projects and utilize the same css files over and over. Because they are not specific. Here's an example: ----div class="c12 bg0 m10 p5 white fl"/div--- This means that the container is 12 columns across, utilizes bg0 has margins of 10px padding of 5 the text is white and it floats left. I could easily change this by removing or adding a new - What I call a "light" style- Instead of creating a single class with all these attributes; I simply combine the single styles as I code the page. This allows me to create any combination of styles and does not limit my creativity or cause me to create a massive number of styles that are similar. Your style sheets become a lot more manageable, minimized and allow you to re-use it over and over. This method I have found to be fantastic for rapid design. I also no longer design first in PSD but in the browser which also saves time. In addition because I have also created a naming system for my backgrounds and page design attributes I simply change out my image file when creating a new project.(bg0 = body background according to my naming system) That means that if I previously had a white background with one project simply changing it to black simply means that on the next project bg0 will be a black background or another image..... I have not found anything wrong with this method yet and it seems to work very well.

你可以只使用一个css文件来提高性能,然后像这样注释掉部分:

/******** Header ************/
//some css here

/******* End Header *********/


/******** Footer ************/
//some css here

/******* End Footer *********/

etc

单个CSS文件的优点是传输效率高。每个HTTP请求意味着每个请求的文件都有一个HTTP头响应,这需要占用带宽。

我把我的CSS作为一个PHP文件,在HTTP头中带有“text/ CSS”mime类型。这样,我可以在服务器端拥有多个CSS文件,并在用户请求时使用PHP include将它们推入单个文件。每个现代浏览器都会接收包含CSS代码的.php文件,并将其作为. CSS文件处理。

也许可以看看compass,这是一个开源的CSS创作框架。 它基于Sass,所以它支持一些很酷的东西,比如变量、嵌套、mixin和导入。如果您想要保持独立的较小CSS文件,但将它们自动合并为一个(避免多次缓慢的HTTP调用),则导入非常有用。 Compass在此基础上增加了一组预定义的mixin,便于处理跨浏览器的东西。 它是用Ruby编写的,但是它可以很容易地用于任何系统....

我更喜欢在开发过程中使用多个CSS文件。这样管理和调试就容易得多。但是,我建议你在部署时使用像YUI Compressor这样的CSS缩小工具,它可以将你的CSS文件合并成一个整体文件。