O documento discute a herança em CSS usando Sass, permitindo que estilos herdem propriedades de outros estilos. Ele explica como usar @extend para aplicar font-weight de .loud para .angry e definir cor vermelha para .angry. Apresenta exemplos de CSS resultantes e fornece links para código e aulas adicionais.

1. Curso
CSS3 com
Sass e Compass:
Herança
#9

2. Agenda!
• Herança!
• Quando Usar!

3. Requisitos!
• Ruby!
• Gem Sass!
• Editor Texto!
• Scout IDE ou terminal!

4. O que é Herança!
Através da herança um estilo pode herdar as
propriedades de outro estilo

5. Usando Herança!
@extend!
.loud { !
font-weight: bold; !
}!
!
.quiet { !
font-weight: lighter; !
}!
!
.angry { !
@extend .loud; !
color: red; !
}!

6. CSS!
.loud, .angry { !
font-weight: bold; !
}!
.quiet { !
font-weight: lighter; !
}!
.angry { !
color: red; !
}!

7. CSS!
.loud, .angry { !
font-weight: bold; !
}!
.quiet { !
font-weight: lighter; !
}!
.angry { !
color: red; !
}!
class="angry"

8. CSS!
.loud, .angry { !
font-weight: bold; !
}!
.quiet { !
font-weight: lighter; !
}!
.angry { !
color: red; !
}!
class="angry"
class="angry loud"

9. Download Código Fonte!
https://github.com/loiane/
curso-css3-sass-compass

10. Todas as aulas do curso!
http://www.loiane.com/2012/03/curso-onlinecss3-com-sass-e-compass-gratuito/

11. http://loiane.com
facebook.com/loianegroner
@loiane
https://github.com/loiane
youtube.com/user/Loianeg

12. Obrigada!