How to utilize css of this style in LESS?
I want to use some css framework but hate its unsemanticness. So I want to use LESS. The basic idea is mixin framework's css into my own classes. But I feel LESS can't handle some scenarios. For example, some classes are define in the framework as:
div.prepand = {...} or * html .span-1 = {...}
LESS mixin doesn't seem to support the above situation开发者_如何学Pythons. Any idea?
I'm not sure which framework did you mean by saying that "some classes are define in the framework as:".
In Less, you don't declare mixins the way you showed it. You do it like so:
.my_mixin { ... }
And then below in the file you can (re)use it like so:
div.content {
.my_mixin;
}
Other than that, I don't understand your question. You want to mixin framework's CSS into your own classes? What does that mean? You write CSS in Less or you don't ...
I've just put together the grid portion of blueprint.css in LESS here. You can set the column and gutter widths, then use mixins like this:
#header {
.span(20);
.prepend(2);
}
I've added a couple of example @media queries as well, allowing for responsive layouts.
I hope it might be of use to someone.
精彩评论