Cheatography
https://cheatography.com
A quick reference for HAML. See more information about HAML here: http://haml-lang.com/docs/yardoc/file.HAML_REFERENCE.html
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 don’t want lines starting with . or - to be parsed. | :javascript | 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:lang='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> |
CommentsHTML 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> |
|
Created By
www.specialbrand.net
Metadata
Favourited By
and 13 more ...
Comments
The HTML example is incorrect. The HAML code has "and" in place of '&'.
Add a Comment
Related Cheat Sheets
More Cheat Sheets by specialbrand