sasset:using_the_extend_method
no way to compare when less than two revisions
Differences
This shows you the differences between two versions of the page.
— | sasset:using_the_extend_method [2016/04/02 11:51] (current) – created leo | ||
---|---|---|---|
Line 1: | Line 1: | ||
+ | |<- [[Creating basic mixins]]|[[Referencing parent selectors with &]] ->| | ||
+ | Étendre les fonctionnalités d'une classe avec une autre | ||
+ | |||
+ | < | ||
+ | .style_a { | ||
+ | background: | ||
+ | } | ||
+ | .style_b { | ||
+ | @extend .style_a; | ||
+ | color: black; | ||
+ | } | ||
+ | .style_c { | ||
+ | @extend .style_a; | ||
+ | color: blue; | ||
+ | } | ||
+ | |||
+ | // output : | ||
+ | |||
+ | .style_a, .style_b, .style_c { | ||
+ | background: | ||
+ | } | ||
+ | .style_b { | ||
+ | color: black; | ||
+ | } | ||
+ | .style_c { | ||
+ | color: blue; | ||
+ | } | ||
+ | |||
+ | </ | ||
+ | |||
+ | Invisible class : si on a pas besoin d'un classe dont on hérite | ||
+ | |||
+ | < | ||
+ | %style_a { | ||
+ | background: | ||
+ | } | ||
+ | .style_b { | ||
+ | @extend .style_a; | ||
+ | color: black; | ||
+ | } | ||
+ | .style_c { | ||
+ | @extend .style_a; | ||
+ | color: blue; | ||
+ | } | ||
+ | |||
+ | // output : | ||
+ | |||
+ | .style_b, style_c { | ||
+ | background: | ||
+ | } | ||
+ | .style_b { | ||
+ | color: black; | ||
+ | } | ||
+ | .style_c { | ||
+ | color: blue; | ||
+ | } | ||
+ | |||
+ | </ |
sasset/using_the_extend_method.txt · Last modified: 2016/04/02 11:51 by leo