Utilizzare extend in LESS per estendere uno stile con altri stili CSS

di Stefano Mostarda, in HTML5, CSS3, LESS,

Molto spesso capita di avere una classe CSS che si vuole applicare ad unìaltra classe CSS. Con i mixin possiamo raggiungere questo risultato, ma esiste un'altra tecnica che può tornare utile e che ricorre all'uso della parola chiave extend. Cominciamo col vedere un esempio di utilizzo in LESS.

p {
  &:extend(.inline);
  background: #000;
}
.inline {
  display:inline;
}

Con questa definizione impostiamo che lo stile "display: inline" si applica a chi usa la classe CSS inline e ai tag p. Il CSS prodotto da questo codice LESS è il seguente:

p {
  background: #000; 
}
.inline, p {
  display:inline;
}

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi