Otimização de tempo com SASS preprocessor
Transferir como PPTX, PDF1 gostou1,289 visualizações
Sass é uma meta-linguagem para CSS que permite escrever folhas de estilo de forma mais estruturada e gerenciável através de recursos como variáveis, mixins e funções. Sass compila arquivos .scss em CSS normal e oferece opções para formatar e minificar a saída. Ele pode ser instalado via RubyGems e usado na linha de comando para compilar arquivos automaticamente quando alterados.
![Usage
C:>sass [options][input]:[output][complementary]](https://image.slidesharecdn.com/rodada-conhecimento-131017094148-phpapp01/85/Otimizacao-de-tempo-com-SASS-preprocessor-14-320.jpg)
Otimização de tempo com SASS preprocessor
- 1. Otimização de tempo com Sass sass-lang.com/
- 2. What is this? Service as a software?
- 3. What is this? Syntactically Awesome Stylesheets
- 4. What is this? Sass é uma meta-linguagem em cima do CSS que é usada para descrever o estilo de um documento de forma limpa e estruturalmente mais poderosa que o próprio CSS. Sass tanto fornece uma sintaxe mais simples, mais elegante como implementa vários recursos que são úteis para a criação de folhas de estilo gerenciáveis.
- 5. Features • Totalmente compatível com CSS3 • Extensões de linguagem, tais como variáveis e mixins • Muitas funções úteis para a manipulação de cores e outros valores • Produção bem formatada e customizável • integração com Firebug
- 6. Features $cor-vermelho: #f00; #main p{ color: lighten($cor-vermelho , 20%); width: 97%; .span{ background-color: darken(#ff0000 , 40%); color: #ff0; } }
- 7. Features #main p{ color: #ff6666; width: 97%; } #main p span{ background-color: #330000; color: #ff0; }
- 8. Install >
- 9. Install Primeiramente, o Ruby Não se preocupe! Você não precisa saber programar em Ruby. Ele servirá apenas para compilar o Sass ;)
- 11. Usage >
- 13. --help
- 15. Usage C:>sass --watch ***.scss:***.css *** você pode especificar um arquivo ou pasta
- 16. Usage C:>sass --watch scss:css --style *** *** nested, compact, compressed, expanded