chuckです。slimにまだまだ慣れていなくて、新たに気づいたことを書きます。
htmlタグのあとはインデント
htmlタグのあとにはインデントが必要です。
インデントなし
htmlタグの後にインデントがありません。これをコンパイルすると、こうなります。
2〜4行目でhtmlタグが完結していますね。
これはインデントが無いことによって、htmlタグだけで完結してしまっているためです。
インデントあり
htmlタグのあとに、インデントがあります。これで、全ての要素がhtmlタグで包まれます。Slimではインデントが重要なんですね。
コンパイル後はこのとおり。
IDとクラスはスペースをあけない
divタグにIDとクラスを指定したいとします。
通常のhtmlに慣れていると、このように書きたくなってしまいます。
ただし、それぞれの属性の間にはスペースは不要です。このままコンパイルするとこうなります。
IDとクラスが内包されるテキストとしてみなされています。それに、インラインのimgタグまでテキストになっていますね。
正しくはこうです。
IDもクラスもスペースを入れずにつなげて書きます。
コンパイル結果はこの通り。
参考にしたサイト様