0% found this document useful (0 votes)
185 views

Haml Cheatsheet

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.

Uploaded by

muzhochan
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
185 views

Haml Cheatsheet

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.

Uploaded by

muzhochan
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

HAML Cheat Sheet

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 &ampamp; 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

You might also like