8000 Using Pseudo class Selectors in Mixins · rusongyu/less.js Wiki · GitHub
[go: up one dir, main page]

Skip to content

Using Pseudo class Selectors in Mixins

elkarrde edited this page Apr 10, 2012 · 2 revisions

In LESS 1.x, you could define a common button style, including :hover and :focus behaviours, in a mixin like this:

    .common-button-styles() {
        color: #fff;
        :hover {
            color: #eee;
        }
    }

And this would output as expected. It would style the button it's used on (as opposed to its c 9B3D hildren).

To continue the above example (in LESS 1.x):

    button {
        .common-button-styles();
    }

The result is:

    button { color: #fff; }
    button:hover { color: #eee; }

In LESS 2 (LESS.js) you can achieve the same thing by using &:hover instead.

Clone this wiki locally
0