¿Hay alguna manera de usar css pseudo clases como mixins con compiladores lesscss?

Question

yo estaba tratando de utilizar una clase con clase pseudo en el menor mixin css

a:link{ 
    color:#138CB4; 
    text-decoration:none; 
} 
a:visited{ 
    a:link; 
    color:#84B6CD; 
} 

Pero cabo pongo lo que tengo es esta, que un css válido

a:link{ 
    color: #138CB4; 
    text-decoration: none; 
} 
a:visited{ 
    a: link; 
    color: #84B6CD; 
} 

Me estoy perdiendo algo aquí o mixins no admite pseudo clases todavía.

Answer 1

No creo que sea así como usas mixin en Less.

Usted ha definido el enlace pseudoclase y luego lo ha anidado bajo la pseudoclase visitada. Esto en realidad no significa nada y es por eso que estás obteniendo ese resultado.

si creo que lo que se está buscando es volver a utilizar sus estilos de enlace a través de: visitado y: enlace, que realmente se desea que esta:

.link { 
    color: #138CB4; 
    text-decoration: none; 
} 

a:link { 
    .link; 
} 

a:visited{ 
    .link; 
    color: #84B6CD; 
} 

Answer 2

que era un poco confundido por esto al principio, también, y me encontré saltando a través de aros para que funcione. Aunque su publicación es lo suficientemente antigua como para que pueda preceder a esta funcionalidad por lo que sé.

De todos modos, si usted está tratando de añadir estilos adicionales a un estilo existente a través de pseudo-selectores, se puede utilizar el '&' operador. Funciona como una palabra clave 'this' y convierte la anidación en una combinación simple. Por lo que debe ser capaz de hacer:

a { 
    color: #138CB4; 
    text-decoration: none; 

    &:visited { 
    color: #84B6CD; 
    } 
} 

Esto debe compilar a algo como:

a { 
    color: #138CB4; 
    text-decoration: none; 
} 

a:visited { 
    color: #84B6CD; 
} 

Tenga en cuenta que también se puede utilizar el & combinar 'sub-selectores':

.outer { 
    color: blue; 

    .error { 
    //this will select elements that are .error inside-of/descending-from .outer 
    } 

    &.error { 
    //This will select elements that are .outer AND .error 
    color: red; 
    } 
} 

Desafortunadamente, la definición oficial se oculta a simple vista en la parte Nesting Rules de la documentación.

Answer 3

No estoy del todo seguro, lo que quiere lograr. Pero si te cansaste de: link,: visted,: (también conocido como enlace normal) activa vs.: enfoque,: vuelo estacionario (estilos libración), esto funciona:

.anchor(@-) { 
    a, a:link, a:visited, a:active { 
     @-(); 
    } 
} 
.anchorH(@-) { 
    a:focus, a:hover { 
     @-(); 
    } 
} 

por ejemplo:

.anchor({ 
    background: #fff; 
}); 

.anchorH({ 
    background: #ddd; /* darken on hover or focus */ 
});