css - Sass: Extending nested selectors -
(i think should mention this, i've started using sass/scss)
http://jsfiddle.net/driftingsteps/t6klncfm/
you can see how <strong>
inheriting properties of global <a>
properties nested <a>
tag.
a { color: #09f; text-decoration: none; &:hover { text-decoration: underline; opacity: 0.6; } } ul { font-size: 0.85em; { font-family: georgia, times, serif; font-style: italic; color: #0a3; } strong { @extend a; } }
i have been going through http://sass-lang.com/ , know i'm missing something. doing wrong? there way inherit properties nested <a>
only, without use of classes on either ul a
, ul strong
? or there better way this?
you use extend-only selector (%
), , extend both ul a
, ul strong
that:
a { color: #09f; text-decoration: none; &:hover { text-decoration: underline; opacity: 0.6; } } ul { font-size: 0.85em; { @extend %a; } strong { @extend %a; } } %a { font-family: georgia, times, serif; font-style: italic; color: #0a3; }
Comments
Post a Comment