#hamlとは
Haml (HTML Abstraction Markup Language)
★概要
HTML template engine
HTMLをすっきり＆美しく
Ruby / Ruby on Rails
★公式サイト
http://haml.info
#準備
Gemfileに追加してbundle install。
gem 'haml-rails'
#使い方
##基本
!!!
%html
%body
hello world!
入れ子構造を使うためには字下げを行う。
字下げの空白は統一する。
!!!
DOCTYPEの生成
%
タグ名の開始タグ、閉じタグを生成する
##コメントアウトの書き方
###html的なコメント
htmlにコメントアウトが表示される
一行
/ bodyの終わり
複数行
/
comment
commemt
###hamlにだけコメント
一行
-# コメント
複数行
-#
コメント
コメント
##属性の付け方
###属性の書き方
%html{:lang => "ja"}
%html{lang: "ja"}
%meta(charset="UTF-8")
id、classの扱いとdivの省略
%div{:id => "main", :class => "myClass"}
%div(id="main" class="myClass")
%div#main.myClass
-# id、classは属性の中でも省略した書き方が出来る。
#main.myClass
-# さらにdivは省略可能なので、よりすっきりと書ける。
##改行のコントロール
一行にまとめて書ける
%p
hello
↓
%p hello
###hamlは複数行でhtmlの表示は一行にする
haml
%ul
%li<
item
↓
html
<ul>
<li>item</li>
</ul>
< : 改行をとってくれる
> : 親要素の改行をとってくれる
haml
%ul
%li<>
item
↓
html
<ul><li>item</li></ul>
##フィルター機能
特定言語としてコンパイルする
:css
.myStyle {
color: red;
}
:javascript
alert(1);
if (1) {
alert(2);
}
%div
:escaped
<html>
</htlm>
:escapedは実体参照として表示する
##Rubyの使い方
%p total is #{5 * 3}
-# #{}を使う
%p= Time.now
-# =を使うことも出来る
- x = 5
%p x
- (1..10).each do |i|
-# %p= i
%p{ :id => "item_#{i}"} #{i}
-# 複雑な表示も出来る