Modular CSS Methods

Question

I want to start using modular CSS, but it's hard for me to figure out how to implement it. I thought I could just use the bridge method where I have one in my HTML and then @import for each module. Although I like the simplicity of this method, I worry about the negative performance effects it has, since the @ import-ed import tables will load later and not necessarily in parallel. So I want to know if there are other popular methods for implementing modular CSS. I really don't want to make a few tags, because PageSpeed ​​and Yslow complain about so many stylesheets (although I know that this is actually more efficient than @import). Ideally, I would like to combine the stylesheets into one on the server, so only every browser asks for one stylesheet.

Answer 1

Using the server side to assemble your “modules” into a single server-side style sheet is definitely recommended here. So there is some kind of cache on the server, so it doesn’t need to build for each request. Many technologies are available for this, but your message does not contain anything about your software stack.

Answer 2

Check out the Compass CSS Framework . It supports modular CSS through mixins and simplifies CSS by adding variables, arithmetic, and including style frames such as Blueprint .

Answer 3

, . - , , CSS-, . . CSS , ? , .

. , 5 / ( )... , , , . , . , , . , , . - ( ) -geek.