LoginSignup
4

More than 5 years have passed since last update.

Jade, Slimを使うなら、Sass記法かStylusを使ったほうがいいと思う

Posted at

JadeやSlimはインデントで記述するHTML Preprocessorです。

Jadeの記述

#demo
  h1 title
  p lorem
  ul.list
    li
      | demo
      br
      | demo
    li demo2

このJadeをテキストの部分だけとってやります。

#demo
  h1
  p
  ul.list
    li
    li

そうすると何かに見えてくるはずです。
そうですね。同じインデント記法で扱えるSassやStylusのセレクタです。
このテキストを抜いたJade(Slim)を貼り付けるだけで、そのままSassなどを書き始めることができます。

Sassに貼り付けて、宣言を書き足した

#demo
  width: 32em
  margin: 0 auto
  h1
    font-size: 2em
  p
    line-height: 1.5
  ul.list
    color: #aaa
    li
      margin: 1em 0

SCSSを使うより、楽ですね。

Qiitaに登録したけど、何も書くことがなかったので、当たり前のことを書いてみました。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4