ゴトー
Sass：ネスト構造のおさらい
標準ネスト .class1 { margin: 0; .class2 { margin: 0; } } ▼CSS出力 .class1 { margin: 0; } .class1 .class2 { margin: 0;…JavaScript：getElementsByTagNameの直下子要素のみ取得版
例えば下記のHTMLがあったとします。 <ul id=”list”> <li> <div></div> </li> <li> <ul> …Haml：textarea、preでの複数行テキスト出力
%textarea :preserve テキスト テキスト %pre = preserve do :escaped <div>test1</div> <div>test2</di…Haml：クラス、IDを付与する
!!! %html %head %title Haml test %body %h1.title Hello World #main %p テスト コンパイルすると下記HTMLに出力されます。 <!DOCTYPE …Haml：出力HTMLのコード内改行を制御する
%div %p %span 改行されるテキスト 例えば上記のようなHamlをコンパイルすると下記HTMLに出力されます。 <div> <p> <span>改行されるテキスト</s…Haml：ループ（for文）を扱う
Hamlの文中でforを使った条件ループを行えます。 !!! %html %head %title Haml test %body %ul.list – for i in 1..5 %li list #{i} コンパイル…Haml：条件分岐（if文）を扱う
Hamlの文中で条件分岐を行えます。 !!! %html %head %title Haml test %body -x = 3 -if x >= 5 %p xは5以上 -else %p xは5未満 コンパイルする…