Descrição
É possível criar um mixin e fazê-lo desaparecer na saída simplesmente colocando os parênteses após ele.
Exemplo
O exemplo a seguir demonstra o uso de mixin no arquivo LESS -
<html>
<head>
<link rel = "stylesheet" href = "style.css" type = "text/css" />
<title>LESS Mixins</title>
</head>
<body>
<div class = "myclass">
<h1>Welcome to Tutorialspoint</h1>
<p>LESS is a CSS pre-processor that enables customizable,
manageable and reusable style sheet for web site.</p>
</div>
</body>
</html>
Em seguida, crie o arquivo style.less .
style.less
.a() {
padding-left: 100px;
}
.myclass {
background : #64d9c0;
.a;
}
Você pode compilar o style.less para style.css usando o seguinte comando -
lessc style.less style.css
Execute o comando acima; ele criará o arquivo style.css automaticamente com o seguinte código -
style.css
.myclass {
background: #64d9c0;
padding-left: 100px;
}
Resultado
Siga estas etapas para ver como o código acima funciona -
Salve o código html acima no less_mixin_not_outputting.html Arquivo.
Abra este arquivo HTML em um navegador, a seguinte saída será exibida.