Sass超入門

573 views
550 views

Published on

Sassの超入門です。

解り辛い所が多いかと思いますが、
その辺はすみません。

デザインもダサいですが
すみません。

Published in: Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
573
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Sass超入門

  1. 1. 水野廉也
  2. 2. ・ 大学生 ・ 専門学校生 ・ 21歳 ・ 口癖:眠い
  3. 3. ・ CSSのメタ言語 ・ Sassを記述してコンパイルしCSSを生成する ・ SassとScssがある ・ Scssが一般的に使われている
  4. 4. Sass Scss
  5. 5. _人人 人人人人_ > Scssのが奇麗 <  ̄Y^Y^Y^Y^Y^Y^Y ̄
  6. 6. ・ Rubyが必要 ・ 基本コマンドライン _人人 人人人_ > メンドクサイ <  ̄Y^Y^Y^Y^Y^Y ̄
  7. 7. Less/Sass/Scss/Markdown/Coffeescript等 を コンパイルしてくれる優秀なやつ
  8. 8. ここにプロジェクトファイルを ドラッグ&ドロップ
  9. 9. こんな感じになる。 大体終わり。
  10. 10. なかのファイルをクリック! Compileをクリック!
  11. 11. はい、完成! おめでとう!
  12. 12. 他にもいいものはたくさんあるので 自分の気に入った物を使うのが一番です。
  13. 13. といっても記述はほとんどCSS! なので新しく何かを覚える必要はほぼ0!!
  14. 14. CSSScss
  15. 15. プロパティの 入れ子なんて技も!
  16. 16. CSSScss
  17. 17. CSSScss
  18. 18. CSSScss
  19. 19. ・ Sassの中でも重要な機能! ・ 小さなテンプレートのみたいなもの ・ メソッドみたいなやつ
  20. 20. CSSScss
  21. 21. Mixinの書き方
  22. 22. Mixinの使い方
  23. 23. ・ CSSだと使用厳禁な@importがSassだとおk! ・ むしろファイルを管理しやすいからおすすめ!
  24. 24. ・ @importされるScssファイル ・ 自作したMixinをパッケージにして管理する時とか
  25. 25. ・ 命名規則 ・ 使用する時
  26. 26. ・ Sassを強力にしたフレームワーク ・ 便利なMixin郡 ・ スプライト自動作成 ・ プロジェクごとの設定ファイル

×