This document is a HAML cheat sheet that provides an overview of HAML syntax and features. It describes HAML document types, filters, elements and attributes, self-closing tags, escaping HTML, classes and IDs, implicit div elements, comments, and the cheat sheet author. Key points covered include HAML syntax for Markdown parsing, inline JavaScript and CSS, self-closing tags, escaping characters, assigning classes and IDs, implicit div wrappers, HTML and HAML comments.
This document is a HAML cheat sheet that provides an overview of HAML syntax and features. It describes HAML document types, filters, elements and attributes, self-closing tags, escaping HTML, classes and IDs, implicit div elements, comments, and the cheat sheet author. Key points covered include HAML syntax for Markdown parsing, inline JavaScript and CSS, self-closing tags, escaping characters, assigning classes and IDs, implicit div wrappers, HTML and HAML comments.
by J Lee (specialbrand) via cheatography.com/395/cs/188/
Doctype !!! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd"> !!! 5 <!DOCTYPE html> !!! Strict <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- strict.dtd"> !!! Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- frameset.dtd"> Filters %p :markdown # Heading Hello, *World* is compiled to: <p> <h1>Heading</h1> <p>Hello, <em>World</em></p> </p> Some Filters Available To Use :plain Does not parse the filtered text. This is useful for large blocks of text without HTML tags, when you dont want lines starting with . or - to be parsed. :javas cript Surrounds the filtered text with <script> and CDATA tags. Useful for including inline Javascript. :css Surrounds the filtered text with <style> and CDATA tags. Useful for including inline CSS. :sass Parses the filtered text with Sass to produce CSS output. :textile Parses the filtered text with Textile. :makuru Parses the filtered text with Maruku, which has some non-standard extensions to Markdown.
Elements %p A paragraph %strong bold is compiled to: <p>A paragraph <strong>bold</strong></p> Attributes %html{:xmlns => "http://www.w3.org/1999/xhtml", "xml:lang" => "en", :lang => "en"} is compiled to: <html xmlns='http://www.w3.org/1999/xhtml' xml:la ng='en' lang='en'></html> Self-Closing Tags %br %meta{'http-equiv' => 'Content-Type', :content => 'text/html'} is compiled to: <br /> <meta http-equiv='Content-Type' content='text/html' /> Escaping HTML &= "I like cheese and crackers" compiles to: I like cheese &amp; crackers
Class and ID %div#things %span#rice Chicken Fried %p.beans{ :food => 'true' } The magical fruit %h1.class.otherclass#id La La La is compiled to: <div id='things'> <span id='rice'>Chicken Fried</span> <p class='beans' food='true'>The magical fruit</p> <h1 class='class otherclass' id='id'>La La La</h1> </div> Implicit Div Elements #collection .item .description What a cool item! is compiled to: <div id='collection'> <div class='item'> <div class='description'>What a cool item!</div> </div> </div> Comments HTML Comments: / %peanutbutterjelly / This is the peanutbutterjelly element I like sandwiches! is compiled to: <peanutbutterjelly> <!-- This is the peanutbutterjelly ellement --> I like sandwiches! </peanutbutterjelly> Haml Comments: -# %p foo -# This is a comment %p bar is compiled to: <p>foo</p> <p>bar</p>
Cheatographer J Lee (specialbrand) cheatography.com/specialbrand/ www.specialbrand.net Cheat Sheet This cheat sheet was published on 5th January, 2012 and was last updated on 5th January, 2012. Sponsor Envoy, for simple and effective bug management. Try it free! http://www.envoyapp.com